Java脚本/Jquery验证问题

Issue with Java script / Jquery validation?

本文关键字：验证 问题 Jquery 脚本 Java      更新时间：2023-09-26

我有一个选择框和一个文本框。我需要验证，如果两者都选择了，我需要像"要么选择一个名字，要么选择名字"这样的警报，如果我没有同时选择两者，我需要"请选择一个名称或选择名字"那样的警报，如果我选择其中一个，我需要象"谢谢你选择名字"一样的警报。我用java脚本做了，但没有得到结果。可以通过使用javascript/Jquery来完成吗？任何建议

    <body>
pick name:
        <select id="ddlView">
            <option value="0">Select</option>
            <option value="1">test1</option>
            <option value="2">test2</option>
            <option value="3">test3</option>
        </select>  
</br>
select name:
<input type= "text" name="raju" id="raju"></input>
        <input type="button" onclick="Validate()" value="select" />
        <script type="text/javascript">
            function Validate()
            {
                 var name = document.getElementById("raju");
                 var e = document.getElementById("ddlView");
                var strUser = e.options[e.selectedIndex].value;
                var strUser1 = e.options[e.selectedIndex].text;
                if(strUser==0 && (name==null || name== ' '))
                {
                    alert("Please select a name or pick the name");
                }
               else if( (!(strUser==0)) &&(! (name==null || name== ' ')))
                {
                    alert("Either select a name or pick the name");
                }
          else
                {
                     alert("Thank you for selecting the name");
                }
            }
        </script>

    </body>

这是您使用JQuery进行的验证，正如您所提到的：

function Validate()
{
    var name = $("#raju").val();
    var selected_name = $('#ddlView :selected').val();
    if(selected_name == 0 && name == "")
    {
        alert("Please select a name or pick the name");
    }
    else if( !(selected_name == 0) && name != "")
    {
        alert("Either select a name or pick the name");
    }
    else
    {
        alert("Thank you for selecting the name");
    }
}

Fiddle

您的问题是您得到的是输入，而不是值。

替换var name=document.getElementById（"raju"）；var name=document.getElementById（"raju"）.value；

此外，您还可以将名称与null和空格进行比较。您必须将它与空字符串进行比较。（name==''）

当您在我的Jsfidle代码中看到时，我不使用oonclick属性，而是在javascript上使用事件侦听器（实际上更适合您的html）。。

document.getElementById("myBtn").onclick= function ()

一秒钟后，您忘记了名称输入的检索.value（所以已经返回[HTMLDOM对象]，而不是null或值.

var name = document.getElementById("raju").value;

由于您的文章是纯JavaScript的，我决定相应地回答。如前所述，不应该检查空字符串中的" "，而应该检查''或""。此外，您甚至不需要执行，因为您可以简单地检查if (str) { // string exists }。对于name变量，您指的是一个HTML元素，而不是它的string值。所以，总的来说（一些错误），这里没有什么大的错误。

我对这个过程进行了一点抽象，让您了解如何在没有大量重复代码的情况下验证许多类似的字段。

注意：您应该找到用unobtrusive处理程序替换inline event handlers的方法。示例：

document.getElementById('someButton').onclick = Validate;

话虽如此，这里有一些建议：

var emptyString = function(str) {
    if (str) {
        return false;
    }
    return true;
};
var emptySelect = function(sel) {
    if (parseInt(sel) !== 0) {
        return false;
    }
    return true;
};

function Validate() {
    var name = document.getElementById("raju").value;
    var e = document.getElementById("ddlView");
    var strUser = e.options[e.selectedIndex].value;
    switch (true) {
        case (!emptySelect(strUser) && !emptyString(name)):
            alert('Either select a name or pick a name.');
            break;
        case (emptySelect(strUser) && emptyString(name)):
            alert('Please select a name or pick a name.');
            break;
        default:
            // Possibly some default validation
            alert('Thanks for picking a name');
            break;
    }
}
相关文章：