fadeOut（）父元素回來

我有一個搜索功能，必須隱藏不符合搜索條件的div。從要素fadeOut（）父元素回來

<div class="form-group" id="number"> 
    <input class="form-control tfInput" id="tfInput1" type="text" value="test"> 
    <button type="button" class="btn btn-success" id="update1"> Save 
    </button> 
    <button type="button" class="btn btn-default" aria-label="Delete" id="delete1">Delete 
    </button> 
</div>

HTML有跡象表明，得到加載到頁面這些div的倍數。所有這些div的類別爲.tfInput，並附加到表單ID爲"list"。

HTML那裏的div得到加載到

<form class="form-inline"> <div class="form-group"> <input class="form-control" type="text" id="searchElement" style="width: 200px" /> <button type="button" class="btn btn-default" onclick="search()">search</button> </div> </form> <div class="container"> <form class="form-inline" id="list"></form> </div>

有id爲"searchElement"一個搜索框和按鈕被點擊，或者在搜索框中keyup()事件時搜索功能被調用。

的Javascript

function search() { $.each($('#list .tfInput'), function(index, input) { if (new RegExp($('#searchElement').val().toUpperCase()).test(input.value.toUpperCase())) { $(input).parent().show(); } else { $(input).parent().fadeOut(); } }) };

問題

的div淡出但它們再次出現相同的第二範圍內。
他們永遠不會隱藏。
任何人的解決方案？

THX

來源

2017-04-19 matthiasgoossens

你什麼時候調用'search（）'？ – Rayon

格式化時，請使用代碼示例，而不是代碼段，如果您只想顯示一段代碼，而不是工作示例。 –

請爲您提供完整的HTML與搜索框 –

我有類似的問題:)試圖阻止你的按鈕，如：

$("#Button").click(
      function(event) { 
        $(this).attr("disabled", true); 
        event.preventDefault(); 
        //your code 
        $(this).attr("disabled", false); 
      }; 
);

對於不明原因的JavaScript喜歡interprete點擊作爲雙擊。

此外，如果你的元素有一個默認的「模式」，它可以回到它。爲了防止它，我們只是使用event.preventDefault（）

第三個選擇是你隱藏它在別的地方。

第四個選項：您正在使用每個tfInput元素。所以它找到第一個隱藏的輸入父項。找到第二個顯示輸入父項。找到第三個 - 隱藏輸入父母再等。 它切換相同的元素。

來源

2017-04-19 09:04:58

試試這個

$(input).fadeOut("slow");

來源

2017-04-19 09:44:54 Pragati

請解釋爲什麼試試這個.. –

它現在固定。

我改變了一些CSS屬性，因爲bootstrap沒有做我所期望的。

這是錯誤，把所有東西搞砸了。

我的錯誤？我將所有div的display屬性更改爲block !important，並因此而不斷重現。

感謝您的所有意見！

來源

2017-04-19 09:58:19 matthiasgoossens

沒有看到那個來:)有幾個原因爲什麼使用！重要是不可能的:) –

將避免使用！在未來的重要:) – matthiasgoossens

fadeOut（）父元素回來

回答

相關問題