织梦提交表单(提交留言)前的js校验

第一种情况:页面有引入jq的

在form标签上加上id

<form action="/plus/diy.php" enctype="multipart/form-data" method="post" id="form1">

js代码:

$("#form1").submit(function() {
    if($("#name").val() == '') {
        alert('请添加姓名');
        $("#name").focus();
        return false;
    }
    if($("#phone").val() == '') {
        alert('请添加电话');
        $("#phone").focus();
        return false;
    }
    if(!$("#phone").val().match(/^((0\d{2,3}-\d{7,8})|(0\d{2,3}\d{7,8})|(1[3456789]\d{9}))$/)) {
        alert("电话格式错误!");
        return false;
    }
    if($("#content").val() == '') {
        alert('请添加内容');
        $("#content").focus();
        return false;
    }
});

第二种情况:页面没有引入jq,需要原生js写

在form标签上加上 onsubmit="return doSubmit()"

<form action="/plus/diy.php" enctype="multipart/form-data" method="post" onsubmit="return doSubmit()">

js代码:

function doSubmit() {
    var txt1 = document.getElementById("txtname");
    var txt2 = document.getElementById("txttel");
    var txt3 = document.getElementById("txtcontent");
    if(txt1.value == "") {
        txt1.style.backgroundColor = "#e3e3e3";
        txt1.focus();
        return false;
    }
    if(txt2.value == "") {
        txt2.style.backgroundColor = "#e3e3e3";
        txt2.focus();
        return false;
    }
    if(txt3.value == "") {
        txt3.style.backgroundColor = "#e3e3e3";
        txt3.focus();
        return false;
    }
};

 

posted @ 2019-04-29 10:34  Ann丶  阅读(760)  评论(0编辑  收藏  举报