关于事件JavaScript

我需要创建登录页，您需要输入促销代码才能继续。有3种不同的操作：输入正确的代码并重定向到另一个页面，输入错误的代码并重定向到错误页面，将字段留空。每个操作都应该调用自己的对话框，从中可以获得消息。我不是程序员，所以我在网上搜索并找到了一些东西

下面是我使用的JavaScript

// REDIRECT
function checkCode(){

// CODE CORRECT
if(document.getElementById('code').value === '123456'){
    //alert('Correct code 1'); 
    location.href = "http://google.com";
} 

// EMPTY CODE
else if (document.getElementById('code').value === ''){
    //alert('You have left field blank. Try again.'); 
    //location.href = "http://google.com";
} 

// WRONG ACTION
else {
    //alert('Wrong code');
    location.href = "fail.html";
    return false;
}
}

//DIALOG SUCCESS
$( function dialogSuccess() {
    $( "#dialog-success" ).dialog({ autoOpen: false });
    $( "#opener" ).click(function dialog() {
        $( "#dialog-success" ).dialog( "open" );
    });
});

//DIALOG EMPTY
$( function dialogError() {
    $( "#dialog-error" ).dialog({ autoOpen: false });
    $( "#opener" ).click(function dialog() {
        $( "#dialog-error" ).dialog( "open" );
    });
});

//DIALOG EMPTY
$( function dialogEmpty() {
    $( "#dialog-empty" ).dialog({ autoOpen: false });
    $( "#opener" ).click(function dialog() {
        $( "#dialog-empty" ).dialog( "open" );
    });
});

// MULTIPLE FUNC    

function checkFunc() {
    checkCode();
    dialogSuccess();
}

以及HTML本身：

<form name=method="post" action="">

        <div class="listen">
            <h2>Enter 6-digit code:</h2>
        </div>
        <div class="listen">
            <input type="text" maxlength="6" id="code" placeholder="XXXXXX" name="6digit" />
        </div>
        <div class="listen">
            <input class="orangebutton" id="opener" type="button" value="Proceed" onclick="checkFunc()" />
        </div>
    </form>

<div id="dialog-empty" title="Error">
    <p>You have left field blank. Try again.</p>
</div>

<div id="dialog-error" title="Error">
    <p>You have entered wrong code. Try again.</p>
</div>

<div id="dialog-success" title="Success">
    <p>Congratulations! You will be proceeded to google.com.</p>
</div>

输入6位代码：
您已将字段留空。再试一次

您输入了错误的代码。再试一次

恭喜你！您将被转到google.com

---

所以基本上我需要输入正确的代码，函数dialogSuccess（）在//code correct中调用，如果输入错误的代码，函数dialogError在//error action中调用。如果我将字段留空，则函数dialogEmpty将在//empty code中调用。或者，另一种方法是更改提交按钮上的id“opener”。另外，如果代码在重定向之前纠正和错误操作，最好能有一些延迟。

我不确定您为什么需要这样做。但是像这样的东西可以做你想做的事：

//重定向
$（“#opener”）。在（'click'，function（）上{
var code=$（'#code'）.val（）；
$（“#对话框成功，#对话框空，#对话框错误”）.addClass（“隐藏”）
如果（代码=='123456'）{
dialogSuccess（）
}否则如果（代码==''）{
dialogEmpty（）；
}否则{
dialogError（）
}
})
//对话成功
函数dialogSuccess（）{
$（“#对话框成功”）.removeClass（“隐藏”）；
}
//对话框为空
函数dialogError（）{
$（“#对话框错误”）.removeClass（“隐藏”）；
}
//对话框为空
函数dialogEmpty（）{
$（“#对话框为空”）.removeClass（“隐藏”）；
}

。隐藏{
显示：无；
}

输入6位代码：
您已将字段留空。再试一次

您输入了错误的代码。再试一次

恭喜你！您将被转到google.com

如果使用jquery脚本，最好只使用jquery。看起来您正在使用jquery对话框，并希望根据条件打开。这是你想要的代码

函数检查码（）{
var值=$（“#代码”）.val（）；
如果（值=='123456'）{
$（“对话成功”）。对话（“打开”）；
//location.href=”http://google.com";
} 
else if（值==''）{
$（“对话框为空”）。对话框（“打开”）；
//location.href=”http://google.com";
} 
否则{
$（“#对话框错误”）。对话框（“打开”）；
//location.href=“fail.html”；
返回false；
}
}
//多重函数
$（函数（）{
$（“#对话成功”）。对话（{
自动打开：错误
});
$（“#对话框错误”）。对话框（{
自动打开：错误
} );
$（“#对话框为空”）。对话框({
自动打开：错误
} );
});
函数checkFunc（）{
检查代码（）；
}
输入6位代码：
您已将字段留空。再试一次

您输入了错误的代码。再试一次

恭喜你！您将被转到google.com

为什么要使用javascript在一部分中获取DOM元素，然后在下一部分中获取jquery？您意识到，使用javascript获取DOM元素是完全不安全的，任何拥有少量知识的用户都可以轻松地完全绕过您的代码？如果要防止滥用，需要让页面将代码发送到服务器端脚本，以便进行验证。任何你重定向到的网页都是你网站的一部分，并且要求用户事先输入正确的代码，在允许访问之前，还必须检查用户的身份和凭据，以防有人试图直接进入而不访问登录页。我知道这一点。它不需要被保护。此代码重定向不是什么特别的东西，不包含任何机密数据。正如我所说，我不熟悉JS和jQuery。所以我使用了我在互联网上找到的代码。好吧，没关系，大家都很清楚。不管怎样，你的问题到底是什么？您给了我们一些代码，但没有解释它当前的功能和缺少的功能。我们有一些“我需要”和“最好有”的陈述（还有一个“可能”也无助于明确意图），但没有任何迹象表明您是否试图实施它们，或者您在实施过程中究竟遇到了什么问题。这不是一个免费的“编写我的代码”服务，但如果您尝试自己做一些研究和编写一些代码，我们将帮助您完成您的尝试。好吧，我想我已经正确地解释了。如您所见，有3个不同的div，其中包含应在事件中调用的消息（输入正确的代码、输入错误的代码和将代码字段留空）。目前我无法在特定事件上调用特定对话框。例如，如果输入正确的代码，则在名为//code correct的事件中应调用函数dialogSuccess。或者我看到的另一种方法是更改事件上提交按钮的id（当前id为“opener”，但可以更改为“opener SuccessThank”，但这不是我想要的。这些带有消息的div就像对话框（源代码）一样，并替换defauld javascript警报框。@ArtjomKorman而不是

$（“\35; box id”）。removeClass（“隐藏”）；

在这些函数中为对话框添加适当的代码。