Question

我有一个允许用户搜索的表单。我正在使用jQuery将搜索结果附加到页面中较低的位置而不重新加载页面。所以，我有这个：

isbn.php:
    <form method="post" action="ajax.php" name="searchISBN" id="searchForm"> 
        <input type="text" name="isbn" placeholder="Search..." />
        <input class="myaccount" id="doSearch" name="doSearch" type="submit" value="Search" />
    </form>

问题是，当用户点击“搜索”按钮或点击进入时，我需要输入文本搜索字段以清除。点击“输入”和“搜索”按钮都会执行搜索，因此必须清除何时发生任何操作。

但是，我绝对难过。

任何帮助将不胜感激!!

修改我已经尝试过Treffynnon的建议了。问题是，我已经禁用了实际加载ajax.php的搜索按钮。因此，当我使用该代码时，它会阻止页面停留在isbn.php上并加载ajax.php。这是加载搜索结果的代码。

isbn.php:
<script>
// attach a submit handler to the form
$("#searchForm").submit(function(event) {
// stop form from submitting normally
event.preventDefault(); 

// get some values from elements on the page:
var $form = $( this ),
term = $form.find( 'input[name="isbn"]' ).val(),
//term = "isbn",
url = $form.attr( 'action' );
    $.post( url, { doSearch: "Search", isbn: term } ,
        function( data ) {
            var content = $( data );

          $( "#result" ).append( content );

      }
    );
});
</script>

Answer 1

$('#searchForm').submit(function(){
    // do search loading code here and then
    $('input[name="isbn"]').val('');
});

根据您的更新尝试此操作：

// attach a submit handler to the form
$("#searchForm").submit(function(event) {
// stop form from submitting normally
event.preventDefault(); 

// get some values from elements on the page:
var $form = $( this ),
$term_input = $form.find('input[name="isbn"]'),
term = $term_input.val(),
//term = "isbn",
url = $form.attr( 'action' );
    $.post( url, { doSearch: "Search", isbn: term } ,
        function( data ) {
            var content = $( data );

          $( "#result" ).append( content );
      }
    );
    $term_input.val('');
});

Answer 2

添加隐藏变量以实现此目的，如下所示：

<form method="post" action="ajax.php" name="searchISBN" id="searchForm">          
    <input type="text" name="isbn_holder" placeholder="Search..." />         
    <input type="hidden" name="isbn"/>
    <input class="myaccount" id="doSearch" name="doSearch" type="submit" value="Search" />     
</form> 

$('#searchForm').submit(function(){     
    $('input[name="isbn"]').val($('input[name="isbn_holder"]').val()); 
    $('input[name="isbn_holder"]').val(''); 
});

清除输入或搜索按钮上的输入文本字段？

2 个答案: