jquery-切换div内div的可见性
|
jQuery函数出现问题。
情况
我得到一个div,其中包含一个
<input type=\"radio\" />
元素列表。这些应该可以远程控制其他两个div的可见性。选中时,第一个无线电输入字段应显示第一个div,其他字段应a)第二个div,b)仅第二个div内的一个div。
问题
第一和第二个主要div之间的显示(显示/隐藏切换)工作正常。无效的是切换第二个div内的div的可见性状态。
<script type=\"text/javascript\">
jQuery( document ).ready( function($)
{
$( \"#post_format_box\" ).addClass( \"hidden\" );
$( \"input#post-format-0\" ).change( function() {
$( \"#postdivrich\" ).removeClass( \"hidden\" );
$( \"#post_format_box\" ).addClass( \"hidden\" );
} );
$( \"input:not(#post-format-0)\" ).change( function() {
$( \"#postdivrich\" ).addClass( \"hidden\" );
$( \"#post_format_box\" ).removeClass( \"hidden\" );
} );
$( \"#post-format-aside\" ).change( function() {
$( \"#aside\" ).removeClass( \"hidden\" );
} );
$( \"#post-format-audio\" ).change( function() {
$( \"#audio\" ).removeClass( \"hidden\" );
} );
$( \"#post-format-chat\" ).change( function() {
$( \"#chat\" ).removeClass( \"hidden\" );
} );
$( \"#post-format-gallery\" ).change( function() {
$( \"#gallery\" ).removeClass( \"hidden\" );
} );
$( \"#post-format-image\" ).change( function() {
$( \"#image\" ).removeClass( \"hidden\" );
} );
$( \"#post-format-link\" ).change( function() {
$( \"#link\" ).removeClass( \"hidden\" );
} );
$( \"#post-format-quote\" ).change( function() {
$( \"#quote\" ).removeClass( \"hidden\" );
} );
$( \"#post-format-status\" ).change( function() {
$( \"#status\" ).removeClass( \"hidden\" );
} );
$( \"#post-format-video\" ).change( function() {
$( \"#video\" ).removeClass( \"hidden\" );
} );
}
);
</script>
div如下所示:
<div id=\"formatdiv\">
<!-- REMOTE CONTROLING DIV -->
<!-- SHOWS/HIDES THE #postdivricht -->
<input type=\"radio\" class=\"post-format-0\" checked=\"checked\" />
<!-- THESE SHOW/HIDE THE SINGLE DIVS INSIDE #postdivricht -->
<input type=\"radio\" id=\"post-format-aside\" />
<input type=\"radio\" id=\"post-format-audio\" />
<input type=\"radio\" id=\"post-format-chat\" />
<input type=\"radio\" id=\"post-format-gallery\" />
<input type=\"radio\" id=\"post-format-image\" />
<input type=\"radio\" id=\"post-format-link\" />
<input type=\"radio\" id=\"post-format-quote\" />
<input type=\"radio\" id=\"post-format-status\" />
<input type=\"radio\" id=\"post-format-video\" />
</div>
<div id=\"postdivrich\">
<!-- FIRST REMOTE CONTROLED DIV -->
</div>
<div id=\"post_format_box\">
<!-- SECOND REMOTE CONTROLED DIV -->
<div id=\"aside\">
<p>Aside</p>
</div>
<div id=\"audio\">
<p>Audio</p>
</div>
<div id=\"chat\">
<p>Chat</p>
</div>
<div id=\"gallery\">
<p>Gallery</p>
</div>
<div id=\"image\">
<p>Image</p>
</div>
<div id=\"link\">
<p>Link</p>
</div>
<div id=\"quote\">
<p>Quote</p>
</div>
<div id=\"status\">
<p>Status</p>
</div>
<div id=\"video\">
<p>Video</p>
</div>
</div>
没有找到相关结果
已邀请:
3 个回复
倪蕊悲潍
请注意:我已将“ 5”属性添加到您的“单选”按钮中。
矾醒忻
成为:
也使用复选框而不是单选框进行切换
藐刚
和
如果想花哨的话可以花10英镑和11英镑 或者,甚至可以用ѭ12