0

高度なオプションを備えたフォームがあります。詳細オプションは div (非表示) にあります。「検索」入力ボックスにキーが設定されている場合、スライドダウンを使用して div を非表示にしたいと思います。コードは次のとおりです (別のソースから部分的に取得: jQuery slideDown with forms ):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    <script src="http://api.jquery.com/resources/events.js"></script>
    <script type="text/javascript">
$("#searched").keypress(function(event) {
  if ( event.which == 13 ) {
     event.preventDefault();
   }
        $("#advanced").slideDown();

});
    </script>
</head>
<body>

<div id="content">
<form action="mycontrolleraddress" method="post" accept-charset="utf-8" name="search_form" id="search_form">

<input type="text" name="query" value="" placeholder="Search..." id="searched"/><br/>

<div id="advanced" style="display: none;">
    From: <input type="text" name="date_from" value="" id="datepicker" onchange="validateDate();" class="datefield"  /><br/>
    To: <input type="text" name="date_to" value="" id="datepicker2" onchange="validateDate();" class="datefield"  /> <br/>
</div>
<input type="submit" name="submit" value="Submit"  />

</div>

</body>
</html>
4

4 に答える 4

0

内部で使用する$(function() {});か、$(document).ready(function() {});

<script type="text/javascript">
    $(function() {
$("#searched").keypress(function(event) {
  if ( event.which == 13 ) {
     event.preventDefault();
   }
        $("#advanced").slideDown();

});
});
    </script>
于 2013-04-22T18:33:25.913 に答える
0 
$('#search_form').on('focus', '#searched', function(e){
    $('#advanced').slideDown();
})
于 2013-04-22T18:33:39.003 に答える
0

解決策は、JavaScriptコードをこれにラップすることです：

$(document).ready(function(){
    // your code
});
于 2013-04-22T18:34:15.630 に答える