下拉菜單驗證JS

Question

我有一個使用PHP動態生成的下拉菜單，我在不同的網頁上使用了這些菜單，現在我還想向這些菜單添加一些JS驗證，以便用戶在填寫表單時不會忘記選擇一個選項。

問題是我的JS代碼不起作用並且無法驗證我的菜單，代碼對我來說看起來不錯，我有IF語句，它們在其中檢查第一個選項值是否為= 0，因此沒有選擇，但仍然無法正常工作

PHP代碼：

    $option='<select id="Forex" name="workshop">';
        $option.='<option value="0">Select Forex Workshop</option>';
        $option.='';
            while($result = mysqli_fetch_assoc($query))
            {
                if($timestamp < $result['endingDate'])
                {
                    $option.='<option id="'.$result['id'].'" value='.$result['endingDate'].'>'.$result['course']." ".$result['schedule'].'</option>';   
                }
            }
            $option.='</select>';
            return $option;             
    }

function getBinary($link){
$timestamp = date("Y-m-d");

    $query2 = mysqli_query($link, $sql2);
        $option2='<select id="Binary" name="workshop">';
        $option2.='<option value="0">Select Binary Workshop</option>';
        $option2.='';
            while($result2 = mysqli_fetch_assoc($query2))
            {
                if($timestamp < $result2['endingDate'])
                {
                    $option2.='<option id="'.$result2['id'].'" value="'.$result2['endingDate'].'">'.$result2['course']." ".$result2['schedule'].'</option>';
                }
            }
            $option2.='</select>';
            return $option2;
}
?>

JS代碼：

        var workshop=document.getElementById('Binary').value;
    if(workshop==0){
        document.getElementById('Binary').style.borderColor = "red";
        document.getElementById('error').innerHTML = "Please Select Workshop1";
        return false;
    }else{
        document.getElementById('Binary').style.borderColor = "green";
    }

        var workshop2=document.getElementById('Forex').value;
    if(workshop2==0){
        document.getElementById('Forex').style.borderColor = "red";
        document.getElementById('error').innerHTML = "Please Select Workshop";
        return false;
    }else{
        document.getElementById('Forex').style.borderColor = "green";
    }

Answer 1

您錯誤地命名了選擇ID /名稱。

$option='<select id="Forex" name="workshop">'; 

但是，您正在嘗試通過id Workshop調用它來從JS訪問它，而name attribute不是Workshop而是id。

  var work=document.getElementById('workshop').value; 

ID是外匯，不是工作坊。 然后您從不同的Js行調用外匯。 我認為您的錯誤在於嘗試訪問null變量。 除非您還有我不知道的id工作坊的另一個要素。