Javascript 如何使用jquery隐藏div onclick和显示onclick

我正在oscommerce脚本中集成搜索建议功能。该函数工作正常，但我需要创建一个div hide onclick，并使用Jquery（具有动画速度）在输入单击时显示，因为当我开始键入时，div显示但无法隐藏（我必须刷新网页以删除搜索建议div）

事件将在此div下创建：

这是我的密码：

$data = '<div class="search">'."\n".
tep_draw_form('quick_find', tep_href_link(FILENAME_ADVANCED_SEARCH_RESULT, '', 'NONSSL', false), 'get', 'id="frmSearch"')."\n".//     '     <label class="fl_left">'.MODULE_BOXES_SEARCH_HEADER_BOX_TITLE.': </label>' ."\n".
'       '.tep_draw_button_search_top().tep_draw_button(MODULE_BOXES_SEARCH_HEADER_BOX_TITLE).tep_draw_button_search_bottom()."\n".
'       <div class="input-width">'."\n".
'       <div class="width-setter">'."\n".
tep_draw_input_field('keywords', MODULE_BOXES_SEARCH_HEADER_BOX_INPUT, 'id="txtSearch" onkeyup="searchSuggest(event);" autocomplete="off" size="10" maxlength="300" class="go fl_left" onblur="if(this.value==\'\') this.value=\''.MODULE_BOXES_SEARCH_HEADER_BOX_INPUT.'\'" onfocus="if(this.value ==\''.MODULE_BOXES_SEARCH_HEADER_BOX_INPUT.'\' ) this.value=\'\'"').''.tep_hide_session_id()."\n".
'           </div>'."\n".
'       <div id="smartsuggest" ></div> '.
'       </div>'."\n".'</form>'."\n".
'</div>
<script type="text/javascript">
$(function(){
var mq = window.matchMedia( "(max-width: 480px)" );
if((mq.matches)) {
$(".input-width").click(function() {
$(this).animate({right: "0", width: "125px"}, 500);
});
$(".input-width input").blur(function(){
$(this).parent().parent().animate({right: "0", width: "125px"}, 500);
});
}else{
$(".input-width").click(function() {
$(this).animate({right: "0", width: "360px"}, 500);
});
$(".input-width input").blur(function(){
$(this).parent().parent().animate({right: "0", width: "190px"}, 500);
});
}

});
</script>
'."\n";

// MOD: BOF - SmartSuggest
if (SMARTSUGGEST_ENABLED != 'false') {
    require(DIR_WS_CLASSES.'smartsuggest.php');
    $smartsuggest = new smartsuggest();
    $smartsuggest->output($data);
}
// MOD: EOF - SmartSuggest

$data=''。\n。
tep\u draw\u form（'quick\u find'，tep\u href\u link（FILENAME\u ADVANCED\u SEARCH\u RESULT'，'NONSSL'，false），'get'，'id=“frmSearch”'）。“\n”。/'.MODULE\u BOX\u SEARCH\u HEADER\u BOX\u TITLE.：”。“\n”。
''.tep\u draw\u button\u search\u top（）.tep\u draw\u button（模块框搜索框标题）。tep\u draw\u button\u search\u bottom（）。“\n”。
''。“\n”。
''。“\n”。
tep\u draw\u input\u field（'keywords'，MODULE\u BOX\u SEARCH\u HEADER\u BOX\u input，'id=“txtSearch”onkeyup=“searchSuggest（event）；“autocomplete=“off”size=“10”maxlength=“300”class=“go fl\u left”onblur=“if（this.value=\'\'\'\”）this.value=\''''''.MODULE\u BOX\u SEARCH\u HEADER\u-input.'.'.''''''''.''''''.'onfocus=“if（this.value==\'.''.value=\''this.value=\'\''）.''.tep\u hide\u session\u id（）。“\n”。
''。“\n”。
'        '.
'.'.\n'.'.'.\n。
'
$（函数（）{
var mq=window.matchMedia（（最大宽度：480px））；
if（（mq.matches））{
$（“.input width”）。单击（函数（）{
动画（{右：“0”，宽度：“125px”}，500）；
});
$（“.input width input”）.blur（函数（）{
$（this.parent（）.parent（）.animate（{右：“0”，宽：“125px”}，500）；
});
}否则{
$（“.input width”）。单击（函数（）{
动画（{右：“0”，宽度：“360px”}，500）；
});
$（“.input width input”）.blur（函数（）{
$（this.parent（）.parent（）.animate（{右：“0”，宽：“190px”}，500）；
});
}
});
“。”\n”；
//MOD:BOF-SmartSuggest
如果（SMARTSUGGEST_已启用！=“false”）{
require（DIR_WS_CLASSES.smartsuggest.php'）；
$smartsuggest=新的smartsuggest（）；
$smartsuggest->输出（$data）；
}
//MOD:EOF-SmartSuggest

通过使用Jquery hide（）和show（）方法，您可以做到这一点……试试……）

$（文档）.ready（函数（）{
$（“#隐藏”）。单击（函数（）{
$（“p”）.hide（）；
});
$（“#显示”）。单击（函数（）{
$（“p”）.show（）；
});
});

如果你点击“隐藏”按钮，我将消失

隐藏
Show
我认为您应该更好地格式化代码。我看不懂那个密码。