0

私はJavaScriptがまったく初めてです。
ユーザーが製品を注文するためのページにサイズと色のドロップダウンがありますが、特定の組み合わせしか利用できません。たとえば、大きなサイズではピンクが唯一の色です。
許可されたサイズの配列を作成し、これらに対してユーザー入力をテストすると思いました。選択が無効な場合は、ポップアップでユーザーに理由を伝えたいと思います。

現実の世界では、SQL と PHP を使用して許可された選択肢の配列を作成します。以下の例では、テスト用に 3 つの有効な選択肢をハードコーディングしています。残念ながら、以下のコードは何もしません。
私はそれが単純な初心者の間違いだと確信しています。私は本当に自分が何をしているのかわかりません:)
誰かが私を助けてくれますか?

ユーザーがフォーム送信をクリックすると、検証機能が発生するはずです...

<form id="form1" name="form1" method="post" onsubmit="return validate_form()"
      action="cart.php">

関数は次のとおりです。

<script type="text/javascript"> 
function validate_form() {
    var allowed = new Array();
        allowed[0]="10,beige";      
        allowed[1]="10,black";
        allowed[2]="10,pink";

    var chosenColInd = document.getElementById("colID");
    var chosenColText = colID.options[colID.selectedIndex].text;
    var chosenSizeInd = document.getElementById("sizeID");
    var chosenSizeText = sizeID.options[sizeID.selectedIndex].text;
    var chosenSizeCol = chosenSizeText+","+chosenColText; 
    var found = "false";

    for ( var i = 0; i < allowed.length; i++ ) {
        if (allowed[i]=chosenSizeCol) {
            found = "true";
        }
    }
    if (found = "false") {
        alert( 'The variation you have selected is currently unavailable. Please select another.' );
        return false;
    } else {
        return true;
    }
}
</script>
4

1 に答える 1

0

=等価演算子 (double または triple equals で、通常 JavaScript では triple が好まれます) の代わりに代入演算子 (single equals ) を使用する行がいくつかあります。例：

if (found = "false") {

一見すると問題のように見えます-それは比較ではなく代入です:)===単一の代わりにトリプルイコールを使用します:

if(found === "false") {

また、JavaScript コードの典型的なスタイルをより反映した、コードへの次の (コメント付きの) 更新を検討してください。

function validate_form() {

    //no need to use new Array(), use array literal instead
    var allowed = [
        "10,beige",      
        "10,black",
        "10,pink"
    ];

    var chosenColInd = document.getElementById("colID");
    var chosenColText = colID.options[colID.selectedIndex].text;
    var chosenSizeInd = document.getElementById("sizeID");
    var chosenSizeText = sizeID.options[sizeID.selectedIndex].text;
    var chosenSizeCol = chosenColText+","+chosenSizeText; 
    var found = "false";


    for ( var i = 0; i < allowed.length; i++ ) {

        //use equality operator instead of assignment
        if (allowed[i]===chosenSizeCol) {
            found = true; //may as well use a boolean rather than string
            break; //exit loop early, no need to continue if we've already found 
        }
    }
    if (!found) { //no need to do a comparison with already boolean values
        alert( 'The variation you have selected is currently unavailable. Please select another.' );
    }
    //may as well just return found here now that we're using a boolean
    return found;
}
于 2012-06-05T22:41:19.440 に答える