【发布时间】:2017-05-29 13:11:16
【问题描述】:
似乎无法使复选框部分正常工作。
.hide() 工作正常,但 else 拒绝再次显示。
相同代码的其他版本会弄乱页面上的其他部分脚本,并且由于加载时间的原因无法切换(如果访问者过早点击它,它最终会被反转!)
基本上,我所寻找的只是在选中复选框时隐藏内容,如果未选中则再次显示。
jQuery(document).ready(function($) {
$('.sponsor_table').hide();
$('.sponsor_address').hide();
$('input[type="checkbox"]').click(function(){
if($('input[name="remain_anonymous"]:checked')) {
$('.sponsor_name').hide();
$('.sponsor_logo').hide();
$('.sponsor_website').hide();
} else {
$('.sponsor_name').show();
$('.sponsor_logo').show();
$('.sponsor_website').show();
}
});
$('input[type="radio"]').click(function(){
if($('input[name="cb_sponsor_attendance"]:checked').val() == "Yes"){
$('.sponsor_table').fadeIn('slow');
$('.sponsor_address').hide();
}
else if($('input[name="cb_sponsor_attendance"]:checked').val() == "No"){
$('.sponsor_address').fadeIn('slow');
$('.sponsor_table').hide();
}
});
});
复选框部分的完整 HTML 是:
<div id="remain_anonymous-wrap" class="form-row anonymous_sponsor"> <label class="give-label" for="ffm-remain_anonymous">
Make this donation anonymous? <span class="give-tooltip give-icon give-icon-question"
data-tooltip="Details will not be shared on the site, or at the event"></span>
</label>
<span data-required="no" data-type="checkbox"></span>
<span class="ffm-fields">
<label>
<input type="checkbox" name="remain_anonymous[]"
value="Yes, please don't share my identity" />
Yes, please don't share my identity </label>
</span>
</div><div id="cb_sponsor_name-wrap" class="form-row sponsor_name"> <label class="give-label" for="ffm-cb_sponsor_name">
Your Name/Business Name <span class="give-tooltip give-icon give-icon-question"
data-tooltip="This will be shared both online and on the table at the gala."></span>
</label>
<input class="textfield"
id="ffm-cb_sponsor_name" type="text"
data-required="no"
data-type="text" name="cb_sponsor_name"
placeholder="" value=""
size=" 100" />
</div><div id="cb_sponsor_logo-wrap" class="form-row sponsor_logo"> <label class="give-label" for="ffm-cb_sponsor_logo">
Photo/Logo </label>
<div id="ffm-cb_sponsor_logo-upload-container">
<div class="ffm-attachment-upload-filelist">
<a id="ffm-cb_sponsor_logo-pickfiles" class="button file-selector"
href="#">Select File(s)</a>
<span class="ffm-file-validation" data-required="no" data-type="file"></span>
<ul class="ffm-attachment-list give-thumbnails">
</ul>
</div>
</div><!-- .container -->
<script type="text/javascript">
jQuery(function ($) {
new Give_FFM_Uploader('ffm-cb_sponsor_logo-pickfiles', 'ffm-cb_sponsor_logo-upload-container', 1, 'cb_sponsor_logo', 'jpg,jpeg,gif,png,bmp,', 2048 );
});
</script>
</div><div id="cb_sponsor_website-wrap" class="form-row sponsor_website"> <label class="give-label" for="ffm-cb_sponsor_website">
Website </label>
<input id="ffm-cb_sponsor_website" type="url" class="give-url"
data-required="no" data-type="text" name="cb_sponsor_website"
placeholder="" value=""
size="100"/>
</div>
【问题讨论】:
-
也请告诉我们
HTML。 -
@urbz - 页面上有另一个复选框,但由插件放置,而不是我。我不知道他们为此使用了什么代码,所有的 HTML 都是由插件生成的。我已经在这里尝试过其他半打帖子的建议......如果我已经尝试了我能想到/找到的所有东西,我觉得我不应该被标记为重复? ://
-
您的 HTML 没有名为
sponsor_name或sponsor_logo的类 -
@MilanChheda - 哎呀!那是我的错。我从错误的帖子中粘贴了 HTML。已更新。