Question

我正在尝试获取输入字段的值，但在更新时它不会抓取它。我正在尝试在表单中创建ajax日志。这是代码

<form method="post" id="contactform">
    <label for="name">Username</label>
    <input type="text"  id="un" placeholder="Username"  />

    <label for="password">Password</label>
    <input type="password"  id="pw" placeholder="Password"  />

    <br/>
    <button name="submit" type="submit" class="btn" id="submit" onclick="logUserIn(); return false;">Log In</button>

    <script type="text/javascript">
    function logUserIn()
    {
        var un = $("#un").val();
        var pw = $("#pw").val();

        alert(un);
    }
    </script>

如果我在输入字段中输入内容并单击“提交”按钮，则不会为我更新。

如果我要像这样手动更改输入值字段

<input type="text"  id="un" placeholder="Username" value="test" />

然后我收到警告“测试”。

Answer 1

jquery站点上val（）的定义指出＆＃34;获取匹配元素集合中第一个元素的当前值＆＃34;。我不确定＆＃34;元素＆＃34;指的是在调试模式中单步执行我的Javascript我可以看到jquery对象（由$（＆＃39;＃field_id＆＃39;）返回）在第一个数组元素中保存原始值，但是在输入文本被更改之后，更新后的值保存在第二个数组元素中。使用last（）为我工作，例如$（＆＃39; #field_id＆＃39;）。last（）。val（）;

Answer 2

我建议您不引人注意地编写JavaScript，即将所有JavaScript保存在脚本标记中，并将标记分开。见Unobtrusive JavaScript - Wikipedia

HTML：

    <form method="post" id="contactform">
      <label for="name">Username</label>
      <input type="text" id="un" placeholder="Username" />
      <label for="password">Password</label>
      <input type="password" id="pw" placeholder="Password"
      />
      <br/>
      <button id="btnLogin" name="submit" type="submit" class="btn" id="submit">Log In</button>
</form>

JavaScript的：

$(function() {
  $('#btnLogin').click(logUserIn);
});

function logUserIn() {
  var un = $("#un").val();
  var pw = $("#pw").val();

  alert(un);

  return false;
}

Live Demo

Answer 3

将空值属性添加到输入标记，我希望这可能对您有用。例如：

<input type="text"  id="un" placeholder="Username" value="" />
<input type="password"  id="pw" placeholder="Password" value="" />

val（）不会获取当前输入值

3 个答案: