0

我正在使用 Foundation 3 并设置了一个下拉列表来根据选择的内容更改 url。花括号中的代码是可以正常工作的 ExpressionEngine 标记。HTML - 选择被隐藏 - 请参阅基础文档,页面底部, http: //bit.ly/1b9gAjG

<form id="materials-year" class="custom">
    <select  class="support attribute" style="display:none;" onChange="this.form.submit()">
      <option>Select Year</option>
      <option value="{site_url}members/">All</option>
      {exp:low_yearly_archives channel="member-materials" limit="50"}
      <option value="{site_url}members/{year}/">{year}</option>
      {/exp:low_yearly_archives}
    </select>

    <div class="custom dropdown">
      <a href="#" class="current">
        Select Year
      </a>
      <a href="#" class="selector"></a>
      <ul>
        <li><a href="/members/">All</a></li>
        {exp:low_yearly_archives channel="member-materials" limit="50"}
        <li><a href="/members/{year}/">{year}</a></li>
        {/exp:low_yearly_archives}
      </ul>
    </div>
</form>

表单没有提交,因为没有提交按钮。但是,如果我取消隐藏选择,添加以下 javascript 表单将正确提交,但这看起来很难看。

javascript

// Year Drop Down on members page
// change url
$(document).ready(function() {
    $('#materials-year select').change(function(){
        window.location = $(this).val();
    });
});

在没有提交按钮的情况下,无法弄清楚要更改哪些内容才能使下拉菜单正常工作。非常感谢所有帮助。

更新

看起来 Foundation 正在删除下拉 div 中的 a 标签。

4

1 回答 1

0

尝试:

$('.dropdown').on('click', 'li a', function (e) {
      var location = this.href;
      if (location != '') { // require a URL
            window.location = location; // redirect
        }
      e.preventDefault();
});

//also make sure the values in your select are actual full URLs
于 2013-06-06T16:25:26.587 回答