Question

我有一个javascript函数，可以从select html元素中删除所选的选项/选项。

function fn_delete()
{
    var result = confirm("Are you sure?");
    if (result) 
    { 
        var x = document.getElementById("t2");
        x.remove(x.selectedIndex);
        var i;
        for(i=0; i<t2.length; i++)
        {
            if(t2.options[i].selected)
            {
                t2.remove(i);
            }
        }
   }
}

问题在于，即使用户没有选择任何选项并点击删除，他仍然会得到＆＃34;您确定＆＃34;的混淆信息。验证是否选择了任何选项以及如何实现它的条件是什么？

Answer 1

你的逻辑只是一点点..调用函数.. THEN问“你确定”IF它是SELECTED

已编辑以下是link

    <input type="checkbox" id="t2">

<div id="remove" onclick="fn_delete()">
Remove
</div>
<script>
function fn_delete() {

  var t2 = document.getElementById("t2");

  var i;
  //alert (t2.length);
  //for (i = 0; i < t2.length; i++) {
  //alert('made for');
    if (t2.checked) {
      var result = confirm("Are you sure?");
      if (result) {
        //t2.remove(i);
        t2.remove(t2.selectedIndex);
      }
    }
  //}

}
</script>

Answer 2

实际上，默认情况下，如果页面重新加载等，则可以选择第一个选项。因此，引入“无”或“空”选项，然后检查ndex是更大的零将有所帮助。您可以明显删除alert(...内容

function fn_delete() {
  var ch = document.getElementById("t2").selectedIndex;
  alert(ch);
  if (ch > 0) {
    var result = confirm("Are you sure?");
    if (result) {
      var x = document.getElementById("t2");
      x.remove(x.selectedIndex);
      var i;
      for (i = 0; i < t2.length; i++) {
        if (t2.options[i].selected) {
          t2.remove(i);
        }
      }
    }
  }
}

<select id="t2">
  <option>nothing</option>
  <option>one</option>
  <option>two</option>
  <option>three</option>
</select>
<input type="button" onClick="fn_delete();" value="check">

Answer 3

您可以在onchange元素上添加select属性，以便在选择了某个选项后启用您的按钮。

你可以通过多种方式实现这一目标。您还可以在按钮上设置一个点击处理程序，以检查是否有选择开始，如另一个用户建议的那样。当事情不处于验证状态时，我更喜欢禁用按钮来点击它们。

＆＃13;

// checks if any options are selected, and enables/disables the Delete button as needed
function checkSelected() {
  var select = document.getElementById("t2"),
    deleteBtn = document.getElementById("delete"),
    hasSelected = false;

  for (var i = 0; i < select.options.length; i++) {
    if (select.options[i].selected) {
      hasSelected = true;
      break;
    }
  }

  deleteBtn.disabled = hasSelected ? '' : 'disabled';
}

// removes the selected options from the list
function fn_delete(optlist) {
  var x = document.getElementById("t2");

  if (confirm("Are you sure?")) {
    x.remove(x.selectedIndex);
    for (var i = 0; i < t2.length; i++) {
      if (t2.options[i].selected) {
        t2.remove(i);
      }
    }
  }
}

＆＃13;

<select multiple id="t2" onchange="checkSelected()">
  <option>One</option>
  <option>Two</option>
  <option>Three</option>
</select>

<br>
<br>

<input type="button" id="delete" value="Delete Selected" disabled onclick="fn_delete()">

＆＃13;

Answer 4

如果未选择任何选项，

selectedIndex 等于-1：

if (x.selectedIndex == -1) {
// please, make a selection
}

如何验证是否选择了选择html元素的选项

4 个答案: