无法附加选项

时间:2010-07-28 19:11:55

标签: javascript jquery

我不确定为什么会这样,但是当我传入数字时

<form id="form1" runat="server">
    <div id="facebookPhotos-iFrameContent">
        <div>
            <p>Log in</p>
            <p id="LoginButtonContainer"><input type="image" id="btnLogin" src="images/loginBtn.jpg" /></p>
            <p><select id="facebookAlbumDropdown" /></p>
            <div id="facebookPhotosContainer" />
        </div>
    </div>
</form>

AddDropdownItem("-Select something test-", "-1", "testDropdown");

function AddDropdownItem(sText, sValue, sDropdownID)
{
      $("#" + sDropdownID).append("<option value=" + sValue + ">" + sText + "</option>");
}

有效

但这不是:

var id = 104388426283811;
AddDropdownItem("-Select something test-", id.toString(), "testDropdown");

默认选项会出现,但是当它尝试添加第二个选项时会突然爆炸而没有我在firebug控制台中看到的错误然后最后列表变为空白(无选项)代码已完成运行。

3 个答案:

答案 0 :(得分:2)

JavaScript会在需要时将整数解释为字符串,不需要使用toString()

答案 1 :(得分:1)

尝试将值放在单引号中,如下所示:

function AddDropdownItem(sText, sValue, sDropdownID)
{
      $("#" + sDropdownID).append("<option value='" + sValue + "'>" + sText + "</option>");
}

你问,“为什么会这么重要。”答案。这是一个很好的做法,当你的值开始有空格时,它可以防止出现问题。我总是把属性值放在引号中。

现在,对于你的问题...我只是尝试使用以下代码,它就像一个魅力!

<p><select name="MyTestDropdown" id="testDropdown"></select></p>

<script type="text/javascript">
    $(document).ready(function () {

        AddDropdownItem("-Select something test-", "-1", "testDropdown");
        AddDropdownItem("something else", "1", "testDropdown");
        AddDropdownItem("another thing", 2, "testDropdown");

        var id = 104388426283811;
        AddDropdownItem("test big value", id.toString(), "testDropdown");

        AddDropdownItem("Profile Pictures", 100001379631246, "testDropdown");

        AddDropdownItem("Test Test2", 104388426283811, "testDropdown");

    });
    function AddDropdownItem(sText, sValue, sDropdownID)
    {
        $("#" + sDropdownID).append("<option value='" + sValue + "'>" + sText + "</option>");
    }
</script>

您的原始代码也可以使用。我不认为它有问题。 :)也许你的代码中的其他地方有问题?

答案 2 :(得分:0)

基于原始问题中的评论主题,这是我的示例页面,其中包含您的逻辑(以及连接按钮以向选项添加选项):

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery Test</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script language="javascript"> 
    $(document).ready(function() {
        $("#btnClick").click(function(e) {
            e.preventDefault();
            var id = 104388426283811;
            AddDropdownItem("-Select something test-", id.toString(), "testDropdown");
            //AddDropdownItem("-Select something test-", "-1", "testDropdown");
        });
    });

    function AddDropdownItem(sText, sValue, sDropdownID)
    {
          $("#" + sDropdownID).append("<option value='" + sValue + "'>" + sText + "</option>");
    }
</script>
</head>
<body>

 <input id='btnClick' type='submit' value='click'></input>
<p><select name="MyTestDropdown" id="testDropdown"></select></p>


</body>
</html>

我没有你提到的iframe,但我正在使用input submit元素添加项目。我通过调用e.preventDefault();来阻止提交按钮的默认行为,然后阻止回发。然后,我就可以将项目添加到select元素。

我希望这会有所帮助。