使用Javascript获取选定的选项ID

时间:2015-04-09 17:37:23

标签: javascript html

我在每个标签中都有一个带选择选项的标签,我希望在我按下提交按钮时在分配给它们的特定网址中提交它。我在javascipt做这件事。我真的是javascript的新手,这就是为什么我需要你的慷慨帮助。 我使用选项卡根据他们的类别划分了我的选择选项,所以我的代码是这样的: 的 HTML

<ul class="ut-nav-tabs clearfix">
    <li class="active"><a href="#t1Tab" data-toggle="tab">Corporate Services</a>
    </li>
    <li class="">
    <a href="#t2Tab" data-toggle="tab">Digital Marketing</a>
    </li>
</ul>

<div id="t1Tab" class="tab-pane clearfix active">
    <form method="post" action="/trendstatic15/#wpcf7-f3409-o1">
        <select id="id_corporateservices">
            <option value="Can a foreign investors open his own company in the Philippines?">Can a foreign investors open his own company in the Philippines?</option>
            <option value="What are the business regulations currently used in the Philippines?">What are the business regulations currently used in the Philippines?</option>
        </select>
        </div>
        <input class="wpcf7-form-control wpcf7-submit" type="submit" value="Submit">
    </form>
</div>

    <div id="t2Tab" class="">
        <form method="post" action="/trendstatic15/#wpcf7-f3409-o1">
            <select id="id_digitalservices">
            <option value="Should I add online video to my web sites?">Should I add online video to my web sites?</option>
            <option value="What works best in Internet marketing?">What works best in Internet marketing?">What works best in Internet marketing?">What works best in Internet marketing?</option>
            </select>
            </div>
            <input class="wpcf7-form-control wpcf7-submit" type="submit" value="Submit">
        </form>
    </div>

JAVASCRIPT

<script type="text/javascript">    
    function redirect() {
        var filename_corporate = document.getElementById('id_corporateservices').value;
        var filename_digital = document.getElementById('id_digitalservices').value;

        var url ='';

        if (filename_digital == 'What works best in Internet marketing?')
        {
            url= 'http://localhost/testsite/digital-page';
        }
        else if(filename_corporate == 'Can a foreign investors open his own company in the Philippines?')
        {
            url= 'http://localhost/testsite/corporate-page';
        }
        else
        {
         url= 'http://anyurlpage.com';
        }

        window.location = url;

        }
</script>

为什么当我在选项中选择任何内容然后提交它时总是直接指向第一个网址条件http://localhost/testsite/digital-page

1 个答案:

答案 0 :(得分:1)

因为你总是指的是id为“id_digitalservices”的一个元素永远不会改变?如果您更改标签可见性并不重要,它仍然保留在DOM中。

您可以使用以下代码获取实际更改的选项值:

<script type="text/javascript">  
function selectmenuOnchange(selectMenuId) {

    //Get the selectmenu element by Id
     var selectmenuID = document.getElementById(selectMenuId);
     //Get selected options value
     var optionValue = selectmenuID.options[selectmenuID.selectedIndex].value;

     //this should return the selectmenu's id
     alert(this.id);

     redirect(optionValue);

}

function redirect(optionValue) {

    var url ='';

    if (optionValue === 'What works best in Internet marketing?')
    {
        url= 'http://localhost/testsite/digital-page';
    }
    else if(optionValue === 'Can a foreign investors open his own company in the Philippines?')
    {
        url= 'http://localhost/testsite/corporate-page';
    }
    else
    {
     url= 'http://anyurlpage.com';
    }

    window.location = url;
}
</script>

您需要编辑两个选择菜单以包含我的onchange函数,如下所示:

HTML

<select onchange="selectmenuOnchange(this.id);">