javascript - 通过 Ajax 传递表单值

Question

我想通过ajax传递输入值。

这是 Html 代码。

 <form action="GET">
 <div id="username" data-role="fieldcontain">     
        <input type="text" name="username" placeholder="User Name" />
          </div>

        <div id="password" data-role="fieldcontain">   
           <input type="password" name="password" id="txtId" placeholder="Password"/>
         </div>


      <a data-role="button" id="log"  data-theme="b" href="#page2" data-transition="slide">Login</a>

  </form>

这是我的脚本。

<script>

 $.ajax({
        url: "http://1xx.1xx.0.1xx:8081/script.login",
            type: "GET",
            data: { 'page':'create_user', 'access':'user','username': +username.val(), 'password': +password.val()},
            dataType: "text",
            success: function (html) {

            }

    });


</script>

在脚本和数据:行中，我使用 username.val() 和 password.val() 从 div 获取输入，而不是对用户名和密码进行硬编码。

请原谅我的网络开发知识，因为我对此很陌生。它不起作用。我做错了什么？

Answer 1

首先<form action="GET">是错的。一定是<form method="GET">

对于我自己来说，将 id 分配给每个文本字段并通过 jquery 选择器获取输入的值。所以，

您的 Html 代码应如下所示..

 <form method="GET">
 <div id="username" data-role="fieldcontain">     
        <input type="text" id="username" name="username" placeholder="User Name" />
          </div>

        <div id="password" data-role="fieldcontain">   
           <input type="password" name="password" id="password" placeholder="Password"/>
         </div>


      <a data-role="button" id="log"  data-theme="b" href="#page2" data-transition="slide">Login</a>

  </form>

脚本应该如下所示..

<script>

 $.ajax({
        url: "http://1xx.1xx.0.1xx:8081/script.login",
            type: "GET",
            data: { 'page':'create_user', 'access':'user','username': +$('#username').val(), 'password': +$('#password').val()},
            dataType: "text",
            success: function (html) {

            }

    });


</script>