Question

我正在尝试使用jquery复制下拉列表。基本上我想要当用户点击一个按钮时它会运行它，它将删除他们在上一个下拉框中选择的值。我最初从mySQL获取我的值。然后将它们输出到下拉列表。当我运行这个时，我唯一得到的就是我的第一个选项，即在我的第二个下拉列表中选择一个兴趣。谁能明白为什么这不起作用？

此外，这些提交到阵列作为数组，因此名称上的方括号。我不确定这是否是造成这种情况的原因，但任何人对此的反馈都是受欢迎的。

Interests<br />
<select name="selectedint[]" id="selectint">
<option selected value="">Select an Interest</option>
<?
for ($i=0; $i<$setintcount; $i++)
{
      if($setinterests[$i] == $interests[$i])
      {
          echo "<option selected value='$setinterests[$i]'>$setinterests[$i]</option>";
      }
      else
      {
          echo "<option value='$setinterests[$i]'>$setinterests[$i]</option>";
      }
}
?>
</select>

<select name="selectedint2[]" id="select">
<option selected value="">Select an Interest</option>
<script>
$('#selectint option').each(function()
{

    $(document).ready(function () {
        if("#selectedint".val() != this)
        {
        document.write(this);
        }
    }
});
</script>
</select>

Answer 1

要复制下拉列表并清除选择，您可以使用clone方法，removeAttr。

var newDD = $("#yourDD").clone();
$("option", newDD).removeAttr("selected");

查看此fiddle

Answer 2

您可以将此逻辑添加到jquery :)我希望这可以帮助您使用 onchange="check_selection(this)" 添加到下拉列表中

<script type="text/javascript">


 function check_selection(elt){
    var index = elt.selectedIndex;    
    if (index == 0) {return true;} // always legal
    var elems = elt.form.elements;
    for (var i=0;i<elems.length;i++) {
    if (elems[i] == elt) {continue;} // don't test self
    if ( index == elems[i].selectedIndex) { // same selectedIndex
    alert("Seleccion duplicada por favor elija otro valor.");
    elt.selectedIndex = 0;
    elt.focus(0);
    return false;
    }
    }
    return true;
    }
</script>

Answer 3

乍一看我注意到的是你在$（'＃selectint选项'）中有$（document）.ready。每个（function（）。这可能导致它甚至无法处理。准备好的文档应该在$（'＃selectint选项'）之外。每个（function（），以便部分仅在文档加载时处理。

2，你的if（“＃selectedint”.val（）！= this）无效。 3，您正在比较选定的值。比较“this”的值时，您需要使用$（this）.val（）。

您的新代码应如下所示：

$(document).ready(function(){
    var $selected = $('#selectedint').val();

    $('#selectedint option').each(function()
    {
        if($selected != $(this).val())
        {
            document.write(this);
        }
    });
});

我注意到的另一件事是，即使用户在顶部下拉菜单中选择了一个选项，底部下拉菜单中也不会发生任何事情。如果您希望底部下拉菜单仅在顶部下拉菜单具有选定值时填充选项，而不是$（document）.ready，请执行类似

的操作

$('#selectedint').change(function(){

因此，当selectedint下拉菜单更改值时，它将填充数据。

在1st Drop down中删除选定值时重复DropDown

3 个答案: