如何在提交按钮上调用<div>单击</div>

时间:2012-04-21 08:51:37

标签: javascript jquery html onclick

  • 请参考下面的代码我学习jquery,我想显示 标记 #child 在提交按钮上单击使用javascript / jquery可以任何人帮我如何调用按钮点击

  • 还想在&gt;&gt;(下一个按钮)&amp;上调用#strong> child和#home 标记&lt;(上一步按钮)**分别在按钮上点击代码&gt;&gt;和&lt;&LT;被写成&amp; lt和&amp; glt。?任何人都可以 帮助我?

            <div data-role="page" id="home">
                <div data-theme="d" data-role="header">
                    <h3>
                        The Grand Bhagvati
                    </h3>
                    <a data-role="button" data-inline="true" data-direction="reverse" data-transition="slide" href="#home">
                        &lt;&lt;
                    </a>
                    <a data-role="button" data-inline="true" data-direction="reverse" data-transition="fade" href="#child">
                        &gt;&gt;
                    </a>
                </div>
                <div data-role="content">
                    <div data-role="fieldcontain">
                        <fieldset data-role="controlgroup" data-mini="true">
                            <label for="textinput1">
                                User:
                            </label>
                            <input id="textinput1" placeholder="Khushu" type="text" />
                        </fieldset>
                    </div>
                    <input data-theme="d" ="submitbtn" value="Login" type="submit"  onSubmit="redirect()"/>
                </div>
                <div data-theme="a" data-role="footer" data-position="fixed" >
                    <h3>
                        Page1
                    </h3>
    
                    </div>
            </div>
    
                             
            <div data-role="page" id="child">
                <div data-theme="d" data-role="header">
                    <h3>
                        The Grand Bhagvati
                    </h3>
                    <a data-role="button" data-inline="true" data-direction="reverse" data-transition="slide" >
                        &lt;&lt;
                    </a>
                    <a data-role="button" data-inline="true" data-direction="reverse" data-transition="fade" >
                        &gt;&gt;
                    </a>
                </div>
                <div data-role="content">
                    <div data-role="fieldcontain">
                        <fieldset data-role="controlgroup" data-mini="true">
                            <label for="textinput1">
                                User:
                            </label>
                            <input id="textinput1" placeholder="Khushu" type="text" />
                        </fieldset>
                    </div>
                    <input data-theme="d" value="Login" type="submit"  onsubmit="redirect()"/>
                </div>
                <div data-theme="a" data-role="footer" data-position="fixed" >
                    <h3>
                        Page1
                    </h3>
    
                    </div>
            </div>
    

3 个答案:

答案 0 :(得分:1)

要显示标签,请使用

$('#child').show();  // where child is the id of the element

并隐藏......

$('#child').hide();

或者,你可以简单地在hide / show之间切换,如下所示:

$('#child').toggle();

将这些附加到按钮的onclick事件......

$(document).ready(function() {
    $('#buttonID').click(function() {
        $('#child').toggle();
    });
});

希望这会有所帮助

答案 1 :(得分:0)

以下代码适用于javascript

var Home= document.getElementById("home");

Home.style.display="none";//To hide the div
Home.style.display="";//To display the div

答案 2 :(得分:0)

Try this in your script
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("#hide").click(function(){
    $("p").hide();
  });
  $("#show").click(function(){
    $("p").show();
  });
});
</script>
</head>
<body>
<button id="hide">Hide</button>
<button id="show">Show</button>
</body>
</html>