Предыдущий поиск будет удален, когда я нажму поиск второго поиска

Может ли кто-нибудь сказать мне, почему мой: $("#buton").click(function() { $("#list").find('li').remove(); }); не работает. Я меняю .find('li') на .find('ul'), но это не помогло. Любое предложение будет высоко оценено. Вот мой код:Предыдущий поиск будет удален, когда я нажму поиск второго поиска

<body> 
    <div class="container"> 
     <div class="jumbotron"> 
      <div class="col-lg-4"> 
       <input type="text" id="KUNDE" size="50" placeholder="Search by name." /> 
      </div> 
      <div class="col-lg-2"> 
       <button class="btn btn-default" type="button" id="buton" value="search" onclick="find();">Search</button>     
      </div> 
     </div> 
     <ul id="list">  </ul> 

     <div class="footer"><p> © Copyright 2016</p> <strong><a href="http://rackpeople.com/">RackPeople</a></strong>.</div> 
    </div> 

    <script> 

     $(function() { 
      $("#KUNDE").focus(); 
     }); 
     $(document).keypress(function (e) { 
      if (e.which == 13) { 
       $("#buton").click(); 
      } 
     });  
     var uri = 'json.json'; 
     function find() { 
      var info = $('#KUNDE').val();   
      $.getJSON(uri) 
       .done(function (data) { 
        var item = data.filter(function (obj) { 
         return obj.name === info || obj.ID === info;      
        })[0]; 
        if (typeof item !== 'undefined' || item !== null) { 
         $("ul").append("<li>" + 'ID  = ' + item.ID, 'Name = ' + item.name, "<br />" + 'Phone  = ' + item.phone, "<br />" + 'Contact  = ' + item.contact, "<br />" + 'BalanceLCY  = ' + item.balanceLCY, "<br />" + 'CreditLimitLCY  = ' + item.creditLimitLCY, "</li>")       
        }     
       }) 
       .fail(function (jqXHR, textStatus, err) { 
        $('#RESULTS').text('Error: ' + err); 
       }); 
     } 

      var options = { 
       url: "json.json", 
       getValue: "name", 
       list: { 
        match: { 
         enabled: true 
        } 
       }, 
       theme: "square" 
      }; 
      $("#KUNDE").easyAutocomplete(options); 

      $("#buton").click(function() { $("#list").find('li').remove(); }); 


    </script> 
</body>

источник

2016-09-09 Ibrahim İnce

говорит Ваш вопрос 'найти («ли»)' еще код 'найти ('уль') '. Ваш 'ul' не содержит дочерних элементов' ul', поэтому jQuery ничего не делает –

'$ (" # list ")' * is * '' '' '' '' '' .find() 'будет находить элементы под этим, но а не сам предмет. Это как '$ (" # id "). Find (" # id ")'. –

Я создал ту же структуру html и ваши элементы связывания и удаления.

$("#button").click(function (e) { 
 
$("#list").find('li').remove(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul id="list"> 
 
<li> 
 
    First result 
 
</li> 
 
<li> 
 
    Second result 
 
</li> 
 
</ul> 
 
<button id="button"> 
 
Remove results 
 
</button>

Первое решение: Ваша проблема заключается в добавление li элементов, конкатенации делается неправильно. Поэтому изменить его на:

$("ul").append("<li>ID  = " + item.ID + "Name = "+ item.name + "<br />Phone  = "+ item.phone + "<br />Contact  = " + item.contact+ "<br />BalanceLCY  = " + item.balanceLCY + "<br /> CreditLimitLCY  = " + item.creditLimitLCY+ "</li>");

В предыдущем пути Вы создавали узлы который был вне li поэтому селектор не исключил их.

Второе решение: Или в конце концов, если Вы хотите оставить Предшествующую структуру empty метода, чтобы очистить всю узловую Детскую:

$("#button").click(function (e) { 
$("#list").empty(); 
});

источник

2016-09-09 08:31:28

Это решило мой вопрос. Почему я так не думал. Спасибо :) –

@ IbrahimInce никаких проблем. –

Предыдущий поиск будет удален, когда я нажму поиск второго поиска

ответ

Смежные вопросы