需要使用当前页面的页面标题动态选择菜单选项

时间:2014-02-18 21:15:40

标签: javascript jquery

我正在使用一个让我有点戴上手铐的CMS。

我需要一个选择菜单导航,它可以告诉它所处的状态(阿拉斯加州,阿拉巴马州等),但我只能使用HTML页面上显示的标记来执行此操作。

我创建了一个选择菜单导航,通过解析现有UL的结构来构建。

这很好用,但它不会“记住”用户当前所在的页面,只选择第一个状态。

所以我的想法是获取页面标题(它将始终是州名称)并将其与选择值/文本进行比较以在选择菜单中选择必要的选项,但我遇到了障碍。< / p>

这似乎是关键点:

$("div.dropDownNav select").val(":contains('" + pageTitleDis + "')");

以下是代码:

HTML

<div class='dropDownNav'>
    <select>
        <option value="http://www.lcl.com/cms/home/products/crop-hail-products/forms-rates-provisions/iowa">Iowa</option>
        <option value="http://www.lcl.com/cms/home/products/crop-hail-products/forms-rates-provisions/kansas">Kansas</option>
        <option value="http://www.lcl.com/cms/home/products/crop-hail-products/forms-rates-provisions/michigan">Michigan</option>
    </select>
</div>

的Javascript

<script>
$(function () {
    var pageTitleDis = $(document).find("title").text();
    $('div.dropDownNav ul').each(function () {
        var select = $(document.createElement('select')).insertBefore($(this).hide());
        $('>li a', this).each(function () {          
            option = $(document.createElement('option')).appendTo(select).val(this.href).html($(this).html());
            $("div.dropDownNav select").val(":contains('" + pageTitleDis + "')");
        });    
        select.change(function () {
            //alert('url = ' + this.value );
            window.location.href = this.value;
        })
    });
})
</script>

感谢任何帮助。

1 个答案:

答案 0 :(得分:0)

此行不是选择器。

$("div.dropDownNav select").val(":contains('" + pageTitleDis + "')"); //wrong

在那里,您将":contains..."指定为值。

尝试:

$(document).ready(function(){
     $('option[value*='+ pageTitleDis+ '").attr('selected','selected');
});

http://jsfiddle.net/kLMM8/1/