wordpress的依赖下拉列表

时间:2014-12-05 03:59:48

标签: javascript ajax wordpress plugins

我到处搜索,找不到我要找的东西..看看这个代码示例:

<div class="ccms_form_element cfdiv_custom" id="style_container_div">

<label for="brand">Make:</label>

<select size="1" id="make" class=" validate['required']" title=""  onChange="updatepage();" type="select" name="style">
<option value="-1">–Choose a Make-</option>
<option class="Audio" value="Audi">Audi</option>
<option class="BMW" value="BMW">BMW</option>
</select>
    <div class="clear"></div><div id="error-message-style"></div>

<div id="style-sub-1"  class="BMW"  style="display: none;" name="stylesub1" onchange="ChangeDropdowns(this.value)">
    <label for="brand">Model:</label>

<select name="cat" id="cat" class="postform">
<option value="-1">–Choose a Model-</option>
<option class="level-0" value="172">1 Series</option>
<option class="level-0" value="173">2 Series</option>
<option class="level-0" value="106">3 Series</option>
</select>
</div>
<div id="style-sub-1"  class="Audi"  style="display: none;" name="stylesub1" onchange="ChangeDropdowns(this.value)">
    <label for="brand">Model:</label>

<select name="cat" id="cat" class="postform">
<option value="-1">–Choose a Model-</option>
<option class="level-0" value="169">A1</option>
<option class="level-0" value="170">A3</option>
<option class="level-0" value="171">A4</option>
</select>
</div>
<div class="clear"></div>
<div id="error-message-style-sub-1"></div></div>

<script type="text/javascript">
function updatepage(){
    $("#make").change ( function () {
        var targID  = $(this).val ();
        $("div#style-sub-1").hide ();
        $('.' + targID).show ();
    } )
}
</script>

用于wordpress使用,出了什么问题? http://jsfiddle.net/sqb4h13r/我认为我在帖子中包含Javascript有问题,我需要将对脚本文件的调用与对JavaScript本身的调用结合起来。但怎么样?有人可以指导我吗?

1 个答案:

答案 0 :(得分:1)

您链接的小提琴无法正常工作:

  1. 您永远不会调用函数updatepage
  2. 您尚未在网页上添加jQuery
  3. 您可以通过将代码移出函数来解决此问题:

    $("#make").change ( function () {
      var targID  = $(this).val ();
      $("div#style-sub-1").hide ();
      $('.' + targID).show ();
    });
    

    包括jQuery。

    这里有一个demo