在 ddSlick 下拉列表中获取所选 <option> 的值答案

【问题标题】：Get value of selected <option> in ddSlick dropdown在 ddSlick 下拉列表中获取所选 <option> 的值
【发布时间】：2012-12-09 07:56:56
【问题描述】：

这当前返回未定义。注释行中应该写什么来提醒当前<option> 标签的值（1、2、3 或 4）？

<select id="dropdown" name="dropdown">
        <option value="0" data-imagesrc="images/icons/all.png">All Questions</option>
        <option value="1" id="friends" data-imagesrc="images/icons/friends.png">Friends</option>
        <option value="2" data-imagesrc="images/icons/friends_of_friends.png">Friends of Friends</option>
        <option value="3" data-imagesrc="images/icons/network.png"><?php echo $network; ?></option>
        <option value="4" data-imagesrc="images/icons/location.png"><?php echo $location ?></option>
</select>

<script type="text/javascript">
$('#dropdown').ddslick({
showSelectedHTML: false,
    onSelected: function(selectedData){
    var str = $(this).attr('id'); // WHAT SHOULD GO HERE?
    alert(str);
    }   
});
</script>

编辑

如果相关，我使用this plugin。

也许this question 可能会有所帮助。我正在尝试理解它。

设法解决了这个问题。最终的工作代码是：

<select id="dropdown" name="dropdown" value="hello">
        <option value="0" data-imagesrc="images/icons/all.png">All Questions</option>
        <option value="1" id="friends" data-imagesrc="images/icons/friends.png">Friends</option>
        <option value="2" data-imagesrc="images/icons/friends_of_friends.png">Friends of Friends</option>
        <option value="3" data-imagesrc="images/icons/network.png"><?php echo $network; ?></option>
        <option value="4" data-imagesrc="images/icons/location.png"><?php echo $location ?></option>
</select>

<script type="text/javascript">
$('#dropdown').ddslick({
    showSelectedHTML: false,
    onSelected: function(data){
        alert(data.selectedData.value);
    }   
});
</script>

【问题讨论】：

你想在选择选项时获取它的值吗？
是的，所以选择是 0、1、2、3 或 4。
selectedData 中有什么内容？不就是选择吗？

标签： javascript jquery select drop-down-menu

【解决方案1】：

使用$(this).val() 代替$(this).attr('id')

当您在<select> 元素上调用.val() 时，将返回当前选定的<option> 的值。

【讨论】：

请看我下面的评论。添加它会冻结下拉列表。
与此无关。它们都与其他插件有关。

【解决方案2】：

$('#dropdown').ddslick({
showSelectedHTML: false,
    onSelected: function(selectedData){
    var str = $(this).val()
    alert(str);
    }   
});

所以，使用val() 而不是attr('id')

【讨论】：

【解决方案3】：

根据您插件的文档，onSelected 方法获取 selectedData 参数：

selectedData（带有文本、值、描述、imageSrc 的嵌套对象）

文本标签和值在onSelected 函数中以selectedData.text 和selectedData.value 的形式提供。试试这个：

$('#dropdown').ddslick({
    showSelectedHTML: false,
    onSelected: function(selectedData){
        var str = selectedData.value
        alert(str);
    }   
});

【讨论】：

谢谢，基本上就是这样。请参阅我对最终工作代码的编辑。
它给了我警报 undefine 这里是代码$('#myDropdown').ddslick({ onSelected: function(selectedData){ var str = selectedData.value alert(str); } });

【解决方案4】：

我从 ddslick 获得了选定的索引，并分配了一个值来分隔输入 >fields。这样我就可以使用输入字段来控制我的表单。我已经编码 > 3 个月了，所以我真的不知道我在做什么。这是一个很长的路要走>这样做，但它似乎工作......

onSelected: function(selectedData){
    alert("selectedData.selectedIndex");
    if(selectedData.selectedIndex == 1 ){
        $("#input1").html(selectedData.selectedIndex);
    }
    if(selectedData.selectedIndex == 2 ){
        $("#input2").html(selectedData.selectedIndex);
    }
    if(selectedData.selectedIndex == 3 ){
        $("#input3").html(selectedData.selectedIndex);
    }
}

【讨论】：

【解决方案5】：

我明白了！！如果您想获取您在数据来源的数组中设置的属性值，您可以像这样获取您的值->

$('#id').ddslick({
    data:dropdowndata,
    width:60,
    selectText: "Select Circle",
    imagePosition:"left",
    //dropdowndata[4].selected:true
    onSelected: function(selectedData){ 
    val = selectedData.selectedIndex;
    alert(dropdowndata[val].value);

【讨论】：

【解决方案6】：

如果要发布数据，创建一个隐藏输入，使用jquery设置隐藏字段的值然后发布隐藏字段

$('.ddslick_drop_down').ddslick({ onSelected: function(selectedData){ //set the value to a hidden field then post the hidden field $('#dish_id').val(selectedData.selectedData.value);

【讨论】：