Javascript 提交表单后加载屏幕

我已经添加了这个脚本

<script>
    $(document).ready(function() { 
        $('#submit-button').click(function() { 
            $.blockUI({ css: { 
                border: 'none', 
                padding: '15px', 
                backgroundColor: '#000', 
                '-webkit-border-radius': '10px', 
                '-moz-border-radius': '10px', 
                opacity: .5, 
                color: '#fff' 
            } }); 

            setTimeout($.unblockUI, 8000); 
        }); 
    }); 

</script>

那么， 如果（firstName！=“”&&lastName！=“”&&email！=“”&&phone！=“”&&doorNumber！=“”&&postcode！=“”&&（phoneLength.length>9 | | phoneLength.length<12））&&slider1>0）

但是，我认为它忽略了滑块1>0，加载屏幕也没有显示

---

如果不清楚，请告诉我（

在正确的路径上，首先需要检查这些字段

           <script>
    $(document).ready(function() { 
        $('#submit-button').click(function() {
//First set your var for the fields you want. the $() is the id of the field in your html 
var firstName = $("#FirstName").text();
if(firstName != "")
{
            $.blockUI({ css: { 
                border: 'none', 
                padding: '15px', 
                backgroundColor: '#000', 
                '-webkit-border-radius': '10px', 
                '-moz-border-radius': '10px', 
                opacity: .5, 
                color: '#fff' 
            } }); 
 setTimeout($.unblockUI, 8000);
}else{
// in here you'll do what ever you wanted to for instance.

alert("Please make sure all fields are filled out");
}

        }); 
    }); 

</script>

$（文档）.ready（函数（）{
$（“#提交按钮”）。单击（函数（）{
//首先为所需字段设置变量。$（）是html中字段的id
var firstName=$（“#firstName”）.text（）；
如果（名字！=“”）
{
$.blockUI（{css:{
边界：“无”，
填充：“15px”，
背景颜色：“#000”，
“-webkit边界半径”：“10px”，
“-moz边界半径”：“10px”，
不透明度：.5，
颜色：'#fff'
} }); 
setTimeout（$.unbui，8000）；
}否则{
//在这里，你可以做任何你想做的事，比如说。
警告（“请确保所有字段均已填写”）；
}
}); 
}); 

试试这个

<script>
    $(document).ready(function() { 
        $('#submit-button').click(function() { 


        //First set your var for the fields you want. the $() is the id of the field in your html 
            var firstName = $("#first-name").text().trim();
            var lastName = $("#last-name").text().trim();
           //Also use alert to make sure the field are really being filled out
            alert(firstName + " " + lastName);

            if(firstName == "" && lastName == "")
            {
             // // in here you'll do what ever you wanted to for instance.
              alert("Please make sure all fields are filled out");
            }
            else{

              $.blockUI({ css: { 
                border: 'none', 
                padding: '15px', 
                backgroundColor: '#000', 
                '-webkit-border-radius': '10px', 
                '-moz-border-radius': '10px', 
                opacity: .5, 
                color: '#fff' 
            } }); 

            setTimeout($.unblockUI, 8000); 

           }

        });         
    }); 

    </script>

$（文档）.ready（函数（）{
$（“#提交按钮”）。单击（函数（）{
//首先为所需字段设置变量。$（）是html中字段的id
var firstName=$（“#first name”）.text（）.trim（）；
var lastName=$（“#last name”）.text（）.trim（）；
//还可以使用alert确保字段确实已填写
警报（firstName+“”+lastName）；
如果（firstName==“”&lastName==“”）
{
////在这里，你想做什么就做什么，例如。
警告（“请确保所有字段均已填写”）；
}
否则{
$.blockUI（{css:{
边界：“无”，
填充：“15px”，
背景颜色：“#000”，
“-webkit边界半径”：“10px”，
“-moz边界半径”：“10px”，
不透明度：.5，
颜色：'#fff'
} }); 
setTimeout（$.unbui，8000）；
}
});         
}); 

这应该行得通，我将.text（）改为.val（）。我还注意到在您的网站上，当您点击f12时，您有两个错误需要处理

<script>
$(document).ready(function() { 
    $('#submit-button').click(function() { 


    //First set your var for the fields you want. the $() is the id of the field in your html 
        var firstName = $("#first-name").val().trim();
        var lastName = $("#last-name").val().trim();
       //Also use alert to make sure the field are really being filled out
        alert(firstName + " " + lastName);

        if(firstName == "" && lastName == "")
        {
         // // in here you'll do what ever you wanted to for instance.
          alert("Please make sure all fields are filled out");
        }
        else{

          $.blockUI({ css: { 
            border: 'none', 
            padding: '15px', 
            backgroundColor: '#000', 
            '-webkit-border-radius': '10px', 
            '-moz-border-radius': '10px', 
            opacity: .5, 
            color: '#fff' 
        } }); 

        setTimeout($.unblockUI, 8000); 

       }

    });         
}); 

</script>

$（文档）.ready（函数（）{
$（“#提交按钮”）。单击（函数（）{
//首先为所需字段设置变量。$（）是html中字段的id
var firstName=$（“#first name”）.val（）.trim（）；
var lastName=$（“#last name”）.val（）.trim（）；
//还可以使用alert确保字段确实已填写
警报（firstName+“”+lastName）；
如果（firstName==“”&lastName==“”）
{
////在这里，你想做什么就做什么，例如。
警告（“请确保所有字段均已填写”）；
}
否则{
$.blockUI（{css:{
边界：“无”，
填充：“15px”，
背景颜色：“#000”，
“-webkit边界半径”：“10px”，
“-moz边界半径”：“10px”，
不透明度：.5，
颜色：'#fff'
} }); 
setTimeout（$.unbui，8000）；
}
});         
}); 

Ad

if

语句在单击函数中，检查输入字段是否包含信息！它确实起作用，现在不显示加载屏幕（当输入字段为空时）。但是加载屏幕也不显示，即使所有输入不再为空。：（将输入类型从

type=“submit”更改为

到

type=“button”

并在

中提交表单。单击（）

函数感谢大家的帮助！感谢！：）它确实有效，现在不显示加载屏幕（当输入字段为空时）。但是加载屏幕也不显示，即使所有输入不再为空：（即使字段为空，您是否希望它显示加载？您是否可以粘贴新代码以便我查看？我刚刚将新代码添加到我的第一篇博文中。我的意思是，即使所有字段都有值，在点击提交按钮后，加载屏幕也不会显示。我添加了您在我的旧博文中所说的内容，请尝试显示给我你的html，看起来你的名字和姓氏没有被正确使用。实际上，再试一件事，我相信这会有帮助。将这些$（“#first name”）.text（）.trim（）；$（“#last name”）.text（）.trim（）；更改为这些$（“#first name”）.val（）.trim（）；$（“#last name”）.val（）.trim（）；没问题，我很高兴能再帮上一件事（我在第一篇文章中添加了新问题。您是否已发出警报（slider1）；以查看它是否返回值？使用此命令返回滑块$（“#form_slider1”）。rangeinput（）；此外，我建议不要对类和id使用相同的名称。

var slider1 = $("#form_slider1").val();

           <script>
    $(document).ready(function() { 
        $('#submit-button').click(function() {
//First set your var for the fields you want. the $() is the id of the field in your html 
var firstName = $("#FirstName").text();
if(firstName != "")
{
            $.blockUI({ css: { 
                border: 'none', 
                padding: '15px', 
                backgroundColor: '#000', 
                '-webkit-border-radius': '10px', 
                '-moz-border-radius': '10px', 
                opacity: .5, 
                color: '#fff' 
            } }); 
 setTimeout($.unblockUI, 8000);
}else{
// in here you'll do what ever you wanted to for instance.

alert("Please make sure all fields are filled out");
}

        }); 
    }); 

</script>

<script>
    $(document).ready(function() { 
        $('#submit-button').click(function() { 


        //First set your var for the fields you want. the $() is the id of the field in your html 
            var firstName = $("#first-name").text().trim();
            var lastName = $("#last-name").text().trim();
           //Also use alert to make sure the field are really being filled out
            alert(firstName + " " + lastName);

            if(firstName == "" && lastName == "")
            {
             // // in here you'll do what ever you wanted to for instance.
              alert("Please make sure all fields are filled out");
            }
            else{

              $.blockUI({ css: { 
                border: 'none', 
                padding: '15px', 
                backgroundColor: '#000', 
                '-webkit-border-radius': '10px', 
                '-moz-border-radius': '10px', 
                opacity: .5, 
                color: '#fff' 
            } }); 

            setTimeout($.unblockUI, 8000); 

           }

        });         
    }); 

    </script>

<script>
$(document).ready(function() { 
    $('#submit-button').click(function() { 


    //First set your var for the fields you want. the $() is the id of the field in your html 
        var firstName = $("#first-name").val().trim();
        var lastName = $("#last-name").val().trim();
       //Also use alert to make sure the field are really being filled out
        alert(firstName + " " + lastName);

        if(firstName == "" && lastName == "")
        {
         // // in here you'll do what ever you wanted to for instance.
          alert("Please make sure all fields are filled out");
        }
        else{

          $.blockUI({ css: { 
            border: 'none', 
            padding: '15px', 
            backgroundColor: '#000', 
            '-webkit-border-radius': '10px', 
            '-moz-border-radius': '10px', 
            opacity: .5, 
            color: '#fff' 
        } }); 

        setTimeout($.unblockUI, 8000); 

       }

    });         
}); 

</script>