0

所以我试图在使用 JQueryUI 的 JSP 中使用一个简单的 Ajax 函数。我只是传入表单中使用的两个文本字段，并尝试用它们填充两个 div。当我单击按钮时，什么都没有发生，我尝试将 console.logs 放在 ajax 函数中并且没有打印任何内容。

按钮单击调用的 JSP 代码（按要求提供完整的 jquery）

<script type="text/javascript">
      $('#saveBtn').click(function() {  
          //define the handler function for click event inline (it doesn't need a name because we're just using it one time)
          // get the value of the search box
          console.log("you are in the ajax");
          var addressValue = $("#address").val();
          var creditValue = $('#creditcard').val();
          System.out.println("you are in the function");
          // send to the server (this is relative to our current page)
          $.ajax({

            url: "actions.InfoAjax.action",
            data: { // this is an embedded JSON object we'll send to server
              address: addressValue,
              creditcard: creditValue
            },
            dataType: 'json',  // tell JQuery to expect JSON back from the server
            success: function(ret) {  // this is called as soon as the server returns

              console.log(ret.address);
              console.log(ret.creditcard);
              $('#savedAddress').html(ret.address);
              $('#savedCC').html(ret.creditcard);


            }//success
          });//ajax

        });//click
      });//ready
    </script>

这是我的html：

<form action="post">
          <input type = "text" name="address" placeholder="Address" ></input></br>
           <input type = "text" name="creditcard" placeholder="Credit Card Number">  </input></br>
          <button type ="button" class ="btn btn-small" id="saveBtn">Save</button>
</form>

我一直试图让它工作几个小时，任何帮助表示赞赏。

以下是我从控制台得到的错误：

 readyState: 4
responseText: "
↵
↵{
↵  "address": [null],
↵  "creditcard": [ test ]
↵}
↵
↵"

1: "parsererror"
2: SyntaxError
get stack: function () { [native code] }
message: "Unexpected token e"
set stack: function () { [native code] }
__proto__: Error
callee: function () {
length: 3
__proto__: Object
4

5 回答 5

1

尝试：

$('#saveBtn').click(function (e) { //define the handler function for click event inline (it doesn't need a name because we're just using it one time)
    e.preventDefault();
    // get the value of the search box
    console.log("you are in the ajax");
    var addressValue = $("#address").val();
    var creditValue = $('#creditcard').val();
    //System.out.println("you are in the function");
    // send to the server (this is relative to our current page)
    $.ajax({

        url : "actions.InfoAjax.action",
        data : { // this is an embedded JSON object we'll send to server
            address : addressValue,
            creditcard : creditValue
        },
        dataType : 'json', // tell JQuery to expect JSON back from the server
        success : function (ret) { // this is called as soon as the server returns

            console.log(ret.address);
            console.log(ret.creditcard);
            $('#savedAddress').html(ret.address);
            $('#savedCC').html(ret.creditcard);

        }, //success
        error : function () {
            console.log(arguments);
        }
    }); //ajax

}); //click
于 2013-03-17T04:57:37.030 回答
0 
$('#foo').click(function() {
   return false;
});

$('#foo').live('click', function() {
   return false;
});

试试看。关闭函数前最后一行的“return false”可能会起作用。

于 2013-03-17T07:14:32.133 回答
0

您也可以创建一个新功能。制作表格：

$(document).ready(function() {
   $('#foo').submit(function() {
      // function here. try it!
      return false;
   });
});
于 2013-03-17T07:19:53.840 回答
0

在 jQuery Docs 中，.click 是 .on('click', handler) 的快捷方式，尝试使用

$(".foo").on("click", function(){
    //your code here
});

还要确保加载包含代码或内联脚本的 JS 文件，以及页面加载时的 jQuery。

于 2013-03-17T05:11:19.133 回答
-2

试试这个并告诉我们

//System.out.println ?? check this
 });//ajax
    return false; 
});//click
于 2013-03-17T04:52:43.643 回答