JQuery Скрыть div не работает

Question

У меня есть div, который я пытаюсь скрыть с помощью функции JQuery;

function hideDiv() { 

     $('SearchDiv').hide() 
    } 

Это относится к кнопке;

<input type="button" style="width:170px; float:right;" value="Search" OnClick="hideDiv()"/> 

The div выглядит следующим образом;

<div id="SearchDiv" style=" border-bottom: 1px; border-style: solid; border-color: darkgrey; background-color: #F3F3F4; width: 100%; color: #4a3c8c; font-family: Verdana; font-size: 9pt;">TEST</div> 

Я попытался с помощью идентификатора клиента, изменения кнопки на жерех: кнопки и все равно не везет в показе DIV! Я также просматривал форумы здесь, не найдя ничего, что сработает для меня.

Любая помощь с этим была бы принята с благодарностью!

Answer 1

Вам не хватает selector после добавления selector он отлично работает.

См. Snippest.

function hideDiv() { 
 

 
     $('#SearchDiv').hide() 
 
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="SearchDiv" style=" border-bottom: 1px; border-style: solid; border-color: darkgrey; background-color: #F3F3F4; width: 100%; color: #4a3c8c; font-family: Verdana; font-size: 9pt;">TEST</div> 
 
<input type="button" style="width:170px; float:right;" value="Search" OnClick="hideDiv()"/>

Answer 2

Вы выбираете элементы типа SearchDiv, где вы должны выбрать элементы с ID SearchDiv:

$("#SearchDiv").hide(); 

Смотрите documentation for the ID selector для более подробной информации.

Кроме того, рассмотреть прикрепление события в коде (так он по-прежнему логически функционирует с JS инвалидов и не смешивать проблемы), это позволит устранить OnClick части и выглядеть следующим образом:

// be sure to put the script tag at the end of your body section. 
$("#SearchDiv").click(function(){ 
    $(this).hide(); 
}); 

Это также лучше практикуйте, чтобы сохранить CSS в файлах CSS (а не в строке) (или, по крайней мере, в теге style), это улучшит производительность и позволит настраивать извне.