1

您好，我对 JQuery 还是很陌生，并且无法使用我遵循的不包含选择框的联系表单教程使验证正常工作。

这是JQuery代码：

$(".txtbar, .txtbox").live("focus", function () {
    var thelabel = $(this).prev();
    var infobox = $(this).next();
    var rowbox = $(this).parent();
    var currid = $(this).attr('id');
    var pxlchange = '-145px';

    if (currid == "contactnumber") {
        pxlchange = '-145px';
    }
    if (currid == "message") {
        pxlchange = '-145px';
    }

    rowbox.addClass('colors');


    thelabel.animate({
        left: pxlchange
    }, 350, 'linear', function () {
        // animation complete
    });

    infobox.animate({
        opacity: 1.0
    }, 350, 'linear', function () {
        // animation complete
    });


    $(this).live("keyup", function () {
        var theval = $(this).val();
        var value = $("subject").val();
        var limitval = 3;
        var replacehtml = "";
        var nameinfohtml = "Not a valid Name!";
        var emailinfohtml = "Not a valid E-mail address!";
        var contactnumberinfohtml = "This field is optional!";
        var subjectinfohtml = "Not a valid subject!";
        var messageinfohtml = "Please fill this field out!";


        if (currid == "name") {
            replacehtml = nameinfohtml;
        } else if (currid == "email") {
            replacehtml = emailinfohtml;
        } else if (currid == "contactnumber") {
            replacehtml = contactnumberinfohtml;
            limitval = 9;
        } else if (value == '0') {
            replacehtml = subjectinfohtml;

        } else if (currid == "message") {
            replacehtml = messageinfohtml;
            limitval = 10;
        }



        // checking against e-mail regex
        if (currid == "email") {
            if (checkValidEmailAddress(theval)) {
                infobox.html("Accepted!");
                infobox.addClass('good');
            } else if (!checkValidEmailAddress(theval)) {
                infobox.html(replacehtml);
                infobox.removeClass('good');
            }
        } else {
            // we use this logic to check for name+message fields
            if (theval.length >= limitval) {
                infobox.html("Accepted!");
                infobox.addClass('good');
            } else if (theval.length < limitval) {
                infobox.html(replacehtml);
                infobox.removeClass('good');
            }                
       // we use this logic to check the subject
            if (value.val() !== '0') {
                infobox.html("Accepted!");
                infobox.addClass('good');
            } else if (value.val() == '0') {
                infobox.html(replacehtml);
                infobox.removeClass('good');
            }
        }


        // now we check if we can display the send button
        // much easier to just look for 'good class on the req fields
        if ($('#name').next().hasClass('good') && $('#email').next().hasClass('good') && $('#message').next().hasClass('good')) {
            // if all 3 boxes are good then we display our send button!
            // jquery validation complete
            $('#sendbtn').animate({
                opacity: 1.0
            }, 200, 'linear', function () {
                // display submitbtn animation complete
            });
        }
    });
});

$(".txtbar, .txtbox").live("blur", function () {
    var thelabel = $(this).prev();
    var infobox = $(this).next();
    var rowbox = $(this).parent();
    var currid = $(this).attr('id');

    rowbox.removeClass('colors');

    infobox.animate({
        opacity: 0
    }, 400, 'linear', function () {
        // animation complete
    });
});

这是我的 JSfiddle 尝试使其工作。

基本上我只是想让它找到值“0”并添加一个“好”类，所以当你选择一个主题时它会读取接受消息，我已经阅读了很多方法来做到这一点，但我并不完全确定如何将它合并到这个脚本中。

感谢您的宝贵时间所有帮助都非常感谢。

4

2 回答 2

1

$("subject").val();应该是$("#subject").val();

您必须在 jquery中添加#以选择id

编辑：

并且您已经分配了var value = $("#subject").val();，但是if (value.val() !== '0')稍后再调用它，这将导致未定义。你应该打电话if (value !== '0') {

于 2013-06-19T00:48:25.480 回答
0

两个问题：

  • var value = $("subject").val();应该：var value = $("#subject").val();
  • $(this).live("keyup", function () {应该：$(this).live("keyup change", function () {

那应该可以解决您的问题，它对我有用。

这是我修改的jsFiddle：http: //jsfiddle.net/MpTbT/

于 2013-06-19T01:08:54.093 回答