将输入的值更新为用户的输入

Updating Value of Input to user's Input

本文关键字:输入 用户 更新      更新时间:2023-09-26

我正在尝试通过ajax实时回显用户的输入来更新页面。但是,当用户键入某些内容并单击"发送"时,不会有任何回声。但是当我通过 html 将输入预设为随机单词并单击"发送"时,将显示该单词。为什么会这样,如何在不手动在 html 中执行此操作的情况下更新输入值?

.HTML

<input type="text" id="userName" name="typeit" value=""/>
<!-- Input containing preset value -->
<input type="text" id="userName" name="typeit" value="cindy"/>
<input type="button" id="text_value" value="send"/>

杰奎里

// I used this to check if the actual input was being updated 
$('#text_value').click(function() {
var text_value = $("#userName").val();
if(text_value=='') {
alert("Please enter a title first");
}else{
alert(text_value);
}
});

我认为你想要的是一个像keyup这样的键盘事件:

$('#userName').keyup(function() {
    var text_value = $(this).val();
    if(text_value=='') {
      alert("Please enter a title first");
    }else{
      $("p").html(text_value);
    }
});

此外,id只能在页面上使用一次,因此您需要更改其中之一:

<input type="text" id="userName" name="typeit" value=""/>
<!-- Input containing preset value -->
<input type="text" id="somethingElse" name="typeit" value="cindy"/>
<input type="button" id="text_value" value="send"/>
<!--for my example-->
<p>Update</p>

小提琴

当你定义id="userName"两次时,你的 HTML 中有一个错误。如果比较字符串,则始终需要===相同的运算符。试试这个片段:

// I used this to check if the actual input was being updated
$('#text_value').click(function() {
  var text_value = $("#userName").val();
  if (text_value === '')
    alert("Please enter a title first");
  else
    alert(text_value);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="Uname" name="typeit" value="" />
<!-- Input containing preset value -->
<input type="text" id="userName" name="typeit" value="cindy" />
<input type="button" id="text_value" value="send" />
<div id="test"></div>