1

I am using javascript to get the selected option from one drop down and then put that information into another drop down. The code work fine in Safari, Chrome and Firefox but fails in IE. Can someone help me make the code cross browser compatible?

    function showTeams(weekNum) {
    var selectedItem = document.getElementById('pick'+weekNum);
    var a = document.getElementById('week'+weekNum).selectedIndex;
    if (a != 0) {
        var str = document.getElementById('week'+weekNum).value;
        var away = str.match(/^(.*)(?= at)/);
        var home = str.match(/at(.*)/);
        selectedItem.options[0].text = away[0];
        selectedItem.options[0].value = away[0];
        selectedItem.options[1].text = home[1];
        selectedItem.options[1].value = home[1];

        document.getElementById('week'+weekNum).style.visibility = "none";
        selectedItem.style.visibility = "visible";
        selectedItem.selectedIndex = 0;
    }
}

It fails in IE at var str = document.getElementById('week'+weekNum).value;, str returns as blank which breaks the regex and everything below it. Any insights and help would be greatly appreciated.

Edit: Adding relevant HTML.

<form class="pick" name="picks" action="./resources/send_picks.php" method="post">
    <p>Week 1: <select class="week" name="week1" id="week1" onchange="javascript:showTeams('1');">
        <option></option>
        <option>Dallas Cowboys at N.Y. Giants</option>
        <option>Indianapolis Colts at Chicago Bears</option>
        <option>New England Patriots at Tennessee Titans</option>
        <option>Buffalo Bills at N.Y. Jets</option>
        <option>Washington Redskins at New Orleans Saints</option>
        <option>Jacksonville Jaguars at Minnesota Vikings</option>
        <option>Atlanta Falcons at Kansas City Chiefs</option>
        <option>Philadelphia Eagles at Cleveland Browns</option>
        <option>St. Louis Rams at Detroit Lions</option>
        <option>Miami Dolphins at Houston Texans</option>
        <option>San Francisco 49ers at Green Bay Packers</option>
        <option>Seattle Seahawks at Arizona Cardinals</option>
        <option>Carolina Panthers at Tampa Bay Buccaneers</option>
        <option>Pittsburgh Steelers at Denver Broncos</option>
        <option>Cincinnati Bengals at Baltimore Ravens</option>
        <option>San Diego Chargers at Oakland Raiders</option>
    </select>
    <select class="pick" name="pick1" id="pick1" style="visibility:hidden" onchange="javascript:cancel('1')">
        <option></option>
        <option></option>
        <option>Cancel</option>
    </select>

Testing is being done on IE8 currently.

4

2 回答 2

1

首先 - 要让 .value 在 IE 中工作,您需要将其实际放入您的 html 中:

<option value="Dallas Cowboys at N.Y. Giants">Dallas Cowboys at N.Y. Giants</option>

第二 - 没有“可见性=无”。试试这个:

document.getElementById('week'+weekNum).style.visibility = "hidden"
于 2012-08-21T13:51:16.647 回答
1

基于其他有问题的问题.valueand .checked,最好使用 jQuery。

var str = $('#week'+weekNum).val();

如果您切换到 jQuery,您将节省大量时间。不再担心 IE 的怪癖(或者不再担心)。

于 2012-08-21T13:45:06.907 回答