0

我的问题是我正在尝试创建一个 javascript 菜单,但脚本似乎加载得很慢而且很晚,所以它在最初几秒钟内无法正常工作。如果我错了,请纠正我。其次,我没有设法让每一列都能正常工作,有时它只是链接到同一个页面,无论我选择哪个选项,以及另一个对我的选择没有反应的问题,就像我没有做的那样即使我真的从菜单中选择了一些东西。

你知道可能是什么问题吗?用 JavaScript 做这件事是个坏主意吗?你会用 PHP 做吗?我还认为代码可能太长了。

这是我的问题的例子 -链接

<div class="quick_width">
      <div class="quick_links"><img src="http://www.101greatgoals.com/wp-content/themes/tutorial/images/quick_links.jpg" width="102" height="37" alt=" "></div>
      <div class="green_bg">
        <div class="option_width">
          <div class="form_row_name_input1">
          <ul class="dropdownul">
<li id="categories">

<?php wp_dropdown_categories('show_option_none=Country'); ?>


<script type="text/javascript"><!--

var dropdown = document.getElementById("cat");

function onCatChange() {

if ( dropdown.options[dropdown.selectedIndex].value > 0 ) {

location.href = "<?php echo get_option('home');

?>/category/goals/"+dropdown.options[dropdown.selectedIndex].text.split(' ').join('-');

}

}

dropdown.onchange = onCatChange;

--></script>

</li>
</ul>
          </div>
          <div class="form_row_name_input1">
          <ul class="dropdownul">
<li id="categories">

<?php wp_dropdown_categories('taxonomy=teams&show_option_none=Teams&name=teamsmenu'); ?>


<script type="text/javascript"><!--

var dropdown = document.getElementById("teamsmenu");

function onCatChange() {

if ( dropdown.options[dropdown.selectedIndex].value > 0 ) {

location.href = "<?php echo get_option('home');

?>/?teams="+dropdown.options[dropdown.selectedIndex].text.split(' ').join('-');

}

}

dropdown.onchange = onCatChange;

--></script>

</li>
</ul>
          </div>

          <div class="form_row_name_input1">
          <ul class="dropdownul">
<li id="categories">

<?php wp_dropdown_categories('taxonomy=players&show_option_none=Players&name=playersmenu'); ?>


<script type="text/javascript"><!--

var dropdown = document.getElementById("playersmenu");

function onCatChange() {

if ( dropdown.options[dropdown.selectedIndex].value > 0 ) {

location.href = "<?php echo get_option('home');

?>/?players="+dropdown.options[dropdown.selectedIndex].text.split(' ').join('-');

}

}

dropdown.onchange = onCatChange;

--></script>

</li>
</ul>
          </div>

          <div class="form_row_name_input1">
          <ul class="dropdownul">
<li id="categories">

<?php wp_dropdown_categories('taxonomy=managers&show_option_none=Managers&name=managersmenu'); ?>


<script type="text/javascript"><!--

var dropdown = document.getElementById("managersmenu");

function onCatChange() {

if ( dropdown.options[dropdown.selectedIndex].value > 0 ) {

location.href = "<?php echo get_option('home');

?>/?managers="+dropdown.options[dropdown.selectedIndex].text.split(' ').join('-');

}

}

dropdown.onchange = onCatChange;

--></script>

</li>
</ul>
          </div>

          <div class="form_row_name_input1">
          <ul class="dropdownul">
<li id="categories">

<?php wp_dropdown_categories('taxonomy=clean_feeds&show_option_none=Other&name=othermenu'); ?>


<script type="text/javascript"><!--

var dropdown = document.getElementById("othermenu");

function onCatChange() {

if ( dropdown.options[dropdown.selectedIndex].value > 0 ) {

location.href = "<?php echo get_option('home');

?>/?clean_feeds="+dropdown.options[dropdown.selectedIndex].text.split(' ').join('-');

}

}

dropdown.onchange = onCatChange;

--></script>

</li>
</ul>
          </div>



        </div>
      </div>
      <div class="right_align"></div>
    </div>
4

1 回答 1

0

在这种情况下,我肯定会建议事先通过 PHP 创建 HTML 输出。这样,当页面加载时,您可以触发您的菜单脚本。

WordPress 参考中提供的wp_dropdown_categories()函数示例有一个很酷的示例,应该可以帮助您。它所做的基本上是替换生成的 HTML 的某些部分。在您的情况下,这些替换将主要在生成的 URL 中。为了清楚起见,此处复制了示例:

<li id="categories">
    <h2><?php _e('Posts by Category'); ?></h2>
    <form action="<?php bloginfo('url'); ?>/" method="get">
    <div>
    <?php
        $select = wp_dropdown_categories('show_option_none=Select category&show_count=1&orderby=name&echo=0');
        $select = preg_replace("#<select([^>]*)>#", "<select$1 onchange='return this.form.submit()'>", $select);
        echo $select;
    ?>
    <noscript><div><input type="submit" value="View" /></div></noscript>
    </div></form>
</li>
于 2012-09-01T10:58:42.607 回答