【发布时间】:2011-08-04 03:46:23
【问题描述】:
我有一组动态单选按钮,它们在选择时都显示/隐藏某些字段,我试图让显示和隐藏字段的相同 jQuery 块也显示正确的预览图像。这是一个wordpress主题。容器(使用 CSS 设置图像背景进行测试)称为#layoutpreview。这是我用来切换背景图像的 jQuery:
if (layoutchecked =="tc")
{
jQuery('#CWP_layout').nextAll('div').hide('')
var layoutchecked = jQuery('.radio_wrapper').children('input:checked').attr('value')
if (layoutchecked =="tc")
{
jQuery('#CWP_tcblk1txt').show('');
jQuery('#CWP_tcblk1txt').addClass('setShowing');
jQuery('#CWP_tcblk1bgcolor').show('');
jQuery('#CWP_tcblk1icon').show('');
jQuery('#CWP_tcblk2txt').show('');
jQuery('#CWP_tcblk2bgcolor').show('');
jQuery('#CWP_tcblk2icon').show('');
jQuery('#CWP_tcblk3txt').show('');
jQuery('#CWP_tcblk3bgcolor').show('');
jQuery('#CWP_tcblk3icon').show('');
jQuery('#layoutpreview').css("background-image", "url('images/previews/3-column-layout.jpg')");
alert ("we changed it");
}
}
HTML 正在编写,因为 WordPress 主题接受一个数组,并吐出单选按钮,这是生成的 HTML 代码:
<div id="CWP_layout" class="cwp_input cwp_radio">
<label for="CWP_layout">Select Layout</label>
<div class="radio_wrapper">
<input type="radio" name="CWP_layout" value="tc" checked='checked' class="CWP_layout"/>Three Columns<br />
<input type="radio" name="CWP_layout" value="tr" class="CWP_layout"/>Three Rows<br />
<input type="radio" name="CWP_layout" value="is" class="CWP_layout"/>Image Slider<br />
<input type="radio" name="CWP_layout" value="iwc" class="CWP_layout"/>Image with Content<br />
<input type="radio" name="CWP_layout" value="osi" class="CWP_layout"/>One Single Image<br />
<input type="radio" name="CWP_layout" value="fsev" class="CWP_layout"/>Full Size Embedded Video<br />
<input type="radio" name="CWP_layout" value="vwti" class="CWP_layout"/>Video with Three Images<br />
</div>
<small>Select the layout for the theme.</small><div class="clearfix"></div>
<div id="layoutpreviewwrap">Layout Of Selected Theme<div id="layoutpreview"></div><br />
</div>
</div>
【问题讨论】:
-
这里没有足够的信息来知道什么是行不通的。您将不得不展示更多代码。
-
同样的脚本适用于我。您是否缺少图像网址前面的“/”?检查您的图片位置。
-
添加了更多代码。 jQuery 所在的图像(并在 css 中测试)位于图像 --> 预览 --> 文件名.jpg 中。当我在 CSS 中使用相同的路径时,它就像我设置为静态的图像的魅力一样。
-
用背景颜色“红色”测试,效果很好
-
嗯。你检查过区分大小写吗?在您的代码中,您使用
images/previews/3-column-layout.jpg,但在您的评论中,您声明Images --> Previews --> Filename.jpg,即大写的文件夹名称...