Question

我有以下代码来设置fullName值，逻辑工作，但在设置值后，所有文本框值都被清除。我需要克服这个问题。

<script>
   $(document).ready(function() {

$('#check').click(function() {

if ( $('#city').val() == '' )
{
    alert('Empty!!!');
}
else
{
 $('#fullName').val("hi");
}
 });
});

</script>

<form name="form1" method="post" action="">
City: <input type="text" name="city" id="city"><br>
Last name: <input type="text" name="LastName" value="Mouse"><br>
Full name: <input type="text" name="fullName" id="fullName"><br>
Phone number: <input type="text" name="Last" value="Mouse"><br>

<button id="check">Check</button>
</form>

Answer 1

默认情况下，表单中但没有类型的按钮是提交按钮。我的猜测是，当您单击按钮时，您实际上是在提交表单，并且因为正在加载新页面而输入被“清除”。

尝试将type="button"添加到按钮中。

<button id="check" type="button">Check</button>

Answer 2

使用PreventDefault()取消回发，因为您的按钮没有类型，因此HTML将默认行为设置为提交，请尝试：

    $('#check').click(function(e) {
          e.preventDefault();
          if ( $('#city').val() == '' )
          {
            alert('Empty!!!');
          }
          else
          {
            $('#fullName').val("hi");
          }
   });

LIVE DEMO

在函数结束后清除文本框值（问题）：JQuery

2 个答案: