在ajax中如何隱藏一個div並在下一個div中顯示成功

Question

我正在使用ajax通過onkeyup進行搜索。 我想顯示所有結果，如果文本框為空，但如果文本框不為空，則根據鍵入的文本顯示。

<input type="text" onkeyup="searchme()" id="search_id" />

   function searchme() {
        var value;
        value = document.getElementById('search_id').value;
          $.ajax({
            type: "GET",
            url: "get_projectList.php",
            data: {value: value,
            'table': 'revenue'},
            success: function (result)
            {$("#resultDiv").html(result); } })
    }

我想顯示.resultDiv ID並隱藏以前顯示的結果
<div id="resultDiv"></div>

get_projectList.php包含結果查詢

提前致謝

Answer 1

function searchme() {
    var value;
    value = document.getElementById('search_id').value;
    if(value.length > 0 )
    {

      $.ajax({
        type: "GET",
        url: "get_projectList.php",
        data: {value: value,
        'table': 'revenue'},
        success: function (result)
        {
         $("#project_all").hide();
         $("#resultDiv").html(result); 

       } })
       }
       else {$("#project_all").show(); }

}


<input type="text" id="search_id" onkeyup="searchme(this)">

 <div id="project_all">  // on page load
  <li>1</li>
  <li>1</li>
  <li>1</li>
  <li>1</li>
  <li>1</li>
 </div>
  <div id="resultDiv">

  </div>

jsfiddle

希望可以幫助:)

為什么要將Ajax結果添加到resultDiv，僅將結果添加到project_all div。

仍然有問題，請告訴我.. :)

Answer 2

成功時，首先將html留空，然后添加成功結果。

 function searchme() { var value; value = document.getElementById('search_id').value; $.ajax({ type: "GET", url: "get_projectList.php", data: {value: value, 'table': 'revenue'}, success: function (result) { $("#project_all").hide() $("#resultDiv").show(); $("#resultDiv").html(); /* works even thisline is excluded */ $("#resultDiv").html(result); } }) }