Javascript 函数不阻止使用 IF ELSE 语句提交表单-6ren

Javascript 函数不阻止使用 IF ELSE 语句提交表单

转载作者：行者123 更新时间：2023-12-03 04:18:35

我正在使用一个小页面来创建一个由两名成员组成的团队，如果有人在两个字段中选择相同的成员，它应该会阻止页面提交。我有趣的是以下代码:

<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
 <script 
 src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js">
</script>
<script 
 src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js">
  </script>
  <link rel="stylesheet" 
href= 
"https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

</head>

<form>
<select name="tm_1_id" id="tm_1_id">
<option>Sajjad</option>
<option>Mahmood</option>
<option>Ahsan</option>
<option>Usman</option>
</select>
<br>
<select name="tm_2_id" id="tm_2_id">
<option>Sajjad</option>
<option>Mahmood</option>
<option>Waqas</option>
<option>Shahnawaz</option>

</select>
<br>
 <input type="submit" name="submit" id="submit" value="Create" 
 onClick="return checkDouble();" />
 </form></html>
 <script>

    var mmbr1 = document.getElementById("tm_1_id");
    var tm1 = mmbr1.options[mmbr1.selectedIndex].value;
    var mmbr2 = document.getElementById("tm_2_id");
    var tm2 = mmbr2.options[mmbr2.selectedIndex].value;
    function checkDouble(){
    if (2>1)
        {
        alert (tm2);
 return false;
    }
 </script>

我创建了一个jsfiddle

如果有人能提供帮助，那将非常有帮助。我知道我的函数就调用函数而言是有效的，但不知何故它不适用于 if 和 else 语句。

最佳答案

试试这个。并匹配 mmbr1 和 mmbr2 所选值。并且您的函数未在 }

结尾正确关闭

var mmbr1 = document.getElementById("tm_1_id");
var tm1 = mmbr1.options[mmbr1.selectedIndex].value;
var mmbr2 = document.getElementById("tm_2_id");
var tm2 = mmbr2.options[mmbr2.selectedIndex].value;

function checkDouble() {

  if (mmbr1.value == mmbr2.value) {
    alert(tm2);
    console.log('fail')
    return false;
  }
  else{
  console.log('pass')
  
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>


<form action="" method="post">
  <select name="tm_1_id" id="tm_1_id">
<option>Sajjad</option>
<option>Mahmood</option>
<option>Ahsan</option>
<option>Usman</option>

</select>
  <br>
  <select name="tm_2_id" id="tm_2_id">
<option>Sajjad</option>
<option>Mahmood2</option>
<option>Ahsan2</option>
<option>Usman2</option>

</select>
  <br>
  <input type="submit" name="submit" id="submit" value="Create" onClick="return checkDouble();" />
</form>