Question

**脚本Noob免责声明**

在我的网站上，我希望它在联系表单中添加字段作为我的产品的订单项，但由于某些原因，wordpress不允许我的功能工作。以下是http://jsfiddle.net/LQ85Z/1/的假设，以及我的网站处理http://ocblinds.com/order-now/的方式。我的网站不允许显示div。谁能看到我做错了什么？

$(function() {
$('#select').change(function() {
    if ($(this).val() == "1") {
        $('#line_1').show();
        $('#line_2').hide();
        $('#line_3').hide();
        $('#line_4').hide();
        $('#line_5').hide();
        $('#line_6').hide();
        $('#line_7').hide();
        $('#line_8').hide();
        $('#line_9').hide();
        $('#line_10').hide();

        }
    });
});
$(function() {
$('#select').change(function() {
    if ($(this).val() == "2") {
        $('#line_1').show();
        $('#line_2').show();
        $('#line_3').hide();
        $('#line_4').hide();
        $('#line_5').hide();
        $('#line_6').hide();
        $('#line_7').hide();
        $('#line_8').hide();
        $('#line_9').hide();
        $('#line_10').hide();
        }
    });
});
    $(function() {
    $('#select').change(function() {
    if ($(this).val() == "3") {
        $('#line_1').show();
        $('#line_2').show();
        $('#line_3').show();
        $('#line_4').hide();
        $('#line_5').hide();
        $('#line_6').hide();
        $('#line_7').hide();
        $('#line_8').hide();
        $('#line_9').hide();
        $('#line_10').hide();

        }
    });
});
    $(function() {
    $('#select').change(function() {
    if ($(this).val() == "4") {
        $('#line_1').show();
        $('#line_2').show();
        $('#line_3').show();
        $('#line_4').show();
        $('#line_5').hide();
        $('#line_6').hide();
        $('#line_7').hide();
        $('#line_8').hide();
        $('#line_9').hide();
        $('#line_10').hide();
        }
    });
});
    $(function() {
    $('#select').change(function() {
    if ($(this).val() == "5") {
        $('#line_1').show();
        $('#line_2').show();
        $('#line_3').show();
        $('#line_4').show();
        $('#line_5').show();
        $('#line_6').hide();
        $('#line_7').hide();
        $('#line_8').hide();
        $('#line_9').hide();
        $('#line_10').hide();
        }
    });
});
    $(function() {
    $('#select').change(function() {
    if ($(this).val() == "6") {
        $('#line_1').show();
        $('#line_2').show();
        $('#line_3').show();
        $('#line_4').show();
        $('#line_5').show();
        $('#line_6').show();
        $('#line_7').hide();
        $('#line_8').hide();
        $('#line_9').hide();
        $('#line_10').hide();
        }
    });
});
    $(function() {
    $('#select').change(function() {
    if ($(this).val() == "7") {
        $('#line_1').show();
        $('#line_2').show();
        $('#line_3').show();
        $('#line_4').show();
        $('#line_5').show();
        $('#line_6').show();
        $('#line_7').show();
        $('#line_8').hide();
        $('#line_9').hide();
        $('#line_10').hide();
        }
    });
});
    $(function() {
    $('#select').change(function() {
    if ($(this).val() == "8") {
        $('#line_1').show();
        $('#line_2').show();
        $('#line_3').show();
        $('#line_4').show();
        $('#line_5').show();
        $('#line_6').show();
        $('#line_7').show();
        $('#line_8').show();
        $('#line_9').hide();
        $('#line_10').hide();
        }
    });
});
    $(function() {
    $('#select').change(function() {
    if ($(this).val() == "9") {
        $('#line_1').show();
        $('#line_2').show();
        $('#line_3').show();
        $('#line_4').show();
        $('#line_5').show();
        $('#line_6').show();
        $('#line_7').show();
        $('#line_8').show();
        $('#line_9').show();
        $('#line_10').hide();
        }
        });
    });
        $(function() {
        $('#select').change(function() {
    if ($(this).val() == "10") {
        $('#line_1').show();
        $('#line_2').show();
        $('#line_3').show();
        $('#line_4').show();
        $('#line_5').show();
        $('#line_6').show();
        $('#line_7').show();
        $('#line_8').show();
        $('#line_9').show();
        $('#line_10').show();
        }
    });
});

Answer 1

您遇到的问题来自于orderform.js脚本底部嵌入了非法字符：

$(function() {
    $('#select').change(function() {
        if ($(this).val() == "10") {
            $('#line_1').show();
            $('#line_2').show();
            $('#line_3').show();
            $('#line_4').show();
            $('#line_5').show();
            $('#line_6').show();
            $('#line_7').show();
            $('#line_8').show();
            $('#line_9').show();
            $('#line_10').show();
        }
    });
});â€‹

删除它，它会正常工作。

您似乎也在页面内部嵌入了javascript代码（它存在于页面源和orderform.js中）。删除源代码中的副本，尤其是它还包含非法字符：

<script type="text/javascript">// <![CDATA[
    $(function() {
    $('#select').change(function() {
        if ($(this).val() == "1") {
            $('#line_1').show();
            $('#line_2').hide();
            $('#line_3').hide();
            $('#line_4').hide();
            $('#line_5').hide();
            $('#line_6').hide();
            $('#line_7').hide();
            $('#line_8').hide();
            $('#line_9').hide();
            $('#line_10').hide();</p>
<p>        }
    });
});

（注意＆lt; / p ＆gt;和＆lt; p ＆gt;）

您还可以优化代码：

$(function() {
    $('#select').change(function() {
        var i, show = parseInt($(this).val(), 10);
        for (i = 1; i <= show; i++) {
            $('#line_' + i).show();
        }
        for (i = show; i < 10; i++) {
            $('#line_' + i).hide();
        }  
    });
});

或使用问题的其他答案（更优雅）。

Answer 2

WordPress在无冲突模式下运行jQuery，因此它不是全局可用的$。以下方法允许您在$上使用.ready()：

jQuery(document).ready(function ($) {
  // Put your scripting here...
});

Wordpress正在阻止我的jquery脚本

2 个答案: