1

我需要一些 JavaScript 代码来验证页面。这是html,

<select id="sel">
<option value="0" selected="selected">Please select</option>
<option value="first">Link 1</option>
<option value="second">Link 2</option>
<option value="third">Link 3</option>
<option value="last">No Link</option>
</select>

<div class="sample" style="display:none;">Sample Text</div>
<input type="button" value="submit" class="inputclass" />

需要一些 JavaScript 代码,

  1. 当用户单击第一个或最后一个选项时,显示 div 并隐藏按钮
  2. 当用户单击任何链接时,隐藏 div 并显示按钮

PS:

Select 中的选项将从数据库中动态生成。我的页面只能在 JavaScript 中运行,因此不需要 Jquery。

请帮忙...

4

1 回答 1

2

我认为这是您需要的代码:

JS部分:

function getSelection(e) {   
    var selection = document.getElementsByTagName("option");
    var index=document.getElementById("sel").selectedIndex;
    var text = document.getElementById("sample");
    var button = document.getElementById("input");
    var option=document.getElementById("sel").options;

    if (option[index].value == "first" || option[index].value == "last") {
        text.style.display = "block";
        button.style.display = "none";
    } else {
        if (text.style.display != "none") {
            text.style.display = "block";
            button.style.display = "none";
        }
        else {
            text.style.display = "none";
            button.style.display = "block";
        }        
    }

    return false;    

}



document.getElementById("input").onclick = function() { getSelection() };

还有HTML(我稍微修改了原来的 HTML 以便更有效地访问 html 元素):

<select id="sel">
<option value="0" selected="selected">Please select</option>
<option value="first">Link 1</option>
<option value="second">Link 2</option>
<option value="third">Link 3</option>
<option value="last">No Link</option>
</select>

<div id="sample" style="display:none;">Sample Text</div>
<input type="button" value="submit" id="input"/>​

...和小提琴: http: //jsfiddle.net/eaRwa/2/ ​</p>

于 2012-07-30T14:02:51.013 回答