【问题标题】:jquery check if option is selectedjquery检查是否选择了选项
【发布时间】:2013-02-27 06:52:33
【问题描述】:

我遇到一种情况,我需要查看是否选择了某个选项。当我单击按钮时,如果未选择某个选项,则选择框应变为红色并提示我。这没用。我对 if 语句有困难。有什么解决办法吗?

Javascript

$(document).ready(function(){

var $films = [];

$("#button").click(function(){
    var $titelBetyg = [];

    var $titel = $('#name').val();
    var $betyg = $('#options').val();

    if($titel == ""){
        $('#name').css('background-color', 'red');
        alert("Fail");
    }
    else if($betyg == "0"){
        $('#options').css('background-color', 'red');
        alert("Fail");
    }
    else{
        $titelBetyg.push($titel);
        $titelBetyg.push($betyg);
        $films.push($titelBetyg);
    }

    $('#rightbar').append($films);
});

});

HTML

<body>
<div id="page">
    <div id="header">
        <h1> Min filminsamling </h1>
    </div>
    <div id="leftbar">
        <form>
            <fieldset>
                <legend>Lägg till en film:</legend>
                Titel:
                <br><input type="text" name="name" id="name"><br>
                Betyg:
                <br><select id="options">
                    <option>Välj betyg här...</option>
                    <option value="1">1</option>
                    <option value="2">2</option>
                    <option value="3">3</option>
                    <option value="4">4</option>
                    <option value="5">5</option>                        
                </select>
                <br><input type="button" name="button" value="Spara film" id="button">
            </fieldset>
            <fieldset>
                <legend>Sortera film:</legend>
                <input type="button" name="stigande" value="Högst betyg" id="stigande">
                <br><input type="button" name="fallande" value="Lägst betyg" id="fallande">
            </fieldset>
        </form>
    </div>
    <div id="rightbar">
        Filmer
    </div>
</div>
</body>

【问题讨论】:

  • 根据浏览器的不同,您实际上会将“Välj betyg här...”作为您的默认值,而不是您期望的“”。 chrome 和其他人一样是罪魁祸首
  • 如果没有选项被标记为选中,则始终选择一个选项(除非您使用的是选项组我认为)。来自HTML4 specification“由于用户代理行为不同,作者应确保每个菜单都包含一个默认的预选选项。”

标签: javascript html css jquery-selectors


【解决方案1】:

$betyg == "0" 不起作用,因为根据 UI 是不可能的。

您的默认选项是……什么都没有。也许是一个空字符串,""0 无处出现。

显式设置一个选项来检查,并检查它。

【讨论】:

  • 是的,类似于格兰特所说的。如果你只是将你喜欢的代码更改为else if(!$betyg){,你应该没问题。
【解决方案2】:

当您检查是否警告未选择任何内容时,您会查看“option”的值是否为“0”。然而,您实际上并没有为没有选择定义“0”的值,您只定义了“1”到“5”的值。如果您要求未定义值的值,我不确定对 Javascript 的期望是什么;我的第一个建议是为无选择定义值“0”,看看它是否有帮助。 :)

【讨论】:

    猜你喜欢
    • 2013-03-17
    • 1970-01-01
    • 2014-03-28
    • 2017-06-11
    • 1970-01-01
    • 1970-01-01
    • 2015-07-05
    • 2015-01-30
    相关资源
    最近更新 更多