Question

所以这就是问题，我一直在尝试使用jQuery将select hide / show字段放入我的wordpress小部件表单中。我有所有的字段，只是脚本无法正常工作。也许我做错了什么，但我搜索过，我找不到答案，也许有人可以提供帮助。

<p class="dot-input-title">
        <label for="widget-bw_adspace-__i__-title">Title</label>
        <input class="widefat" id="widget-bw_adspace-__i__-title" name="widget-bw_adspace[__i__][title]" type="text" value="" />
    </p>

    <div class="dot-select-type">
        <select id="widget-bw_adspace-__i__-type" class="bw-select widefat" name="widget-bw_adspace[__i__][type]" >
                            <option value="upload" id="upload" >Upload Ad Image</option><option value="custom" id="custom" >Custom Script</option>          </select>

    </div>

    <div id="dot-input-upload">
        <label for="widget-bw_adspace-__i__-src">Upload Ad Image</label>
        <img style="width:100%" src="" />
        <input type="text" id="widget-bw_adspace-__i__-src" class="widefat bw_src" name="widget-bw_adspace[__i__][src]" value="" />
        <input type="button" class="bw_button button" name="widget-bw_adspace[__i__][src]_button" id="widget-bw_adspace-__i__-src_button" value="Upload" />
        <p>Use this field to upload or select and image from the media library.</p>

        <label for="widget-bw_adspace-__i__-url">Add URL</label>
        <input class="widefat" id="widget-bw_adspace-__i__-url" name="widget-bw_adspace[__i__][url]" type="text" value="" />
        <p>Add a URL to the selected ad.</p>
    </div>

    <div id="dot-textarea-custom-script">
        <label for="widget-bw_adspace-__i__-custom">Custom Script</label>
        <textarea class="widefat" id="widget-bw_adspace-__i__-custom" name="widget-bw_adspace[__i__][custom]" value="" col="20" rows="16"></textarea>
    </div>



jQuery(document).ready(function(){

    $('#dot-input-upload').hide();
    $('#dot-textarea-custom-script').hide();

    $('.bw-select').change(function() { 

        if ($(".bw-select").val() == "upload") {

                $("#dot-input-upload").show();
                $("#dot-textarea-custom-script").hide();

        } else {

                $("#dot-input-upload").hide();
        };

        if ($(".bw-select").val() == "custom") {

                $("#dot-input-upload").hide();
                $("#dot-textarea-custom-script").show();

        } else {

                $("#dot-textarea-custom-script").hide();
        };
    });

});

Answer 1

好的，就在这里。

<select id="widget-bw_adspace-__i__-type bw-select" class="bw-type widefat" name="widget-bw_adspace[__i__][type]" >

您选择使用$('.bw-select')，但是您已将bw-select附加到ID而不是该类。

NB $('#bw-select')将不会选择该元素，因为该ID无效，它有空格。

Answer 2

jQuery的（文件）。就绪（函数（）{

更改为

（文档）$。就绪（函数（）{

或将所有$更改为jQuery;

选择在WordPress窗口小部件窗体中隐藏/显示

2 个答案: