javascript不显示警告消息
[英]javascript doesn't show alert message
问题描述
I am working with radio buttons and a submit button to send the inputs of the radio buttons to a javascript file called script.js. 
我正在使用单选按钮和一个提交按钮，以将单选按钮的输入发送到名为script.js的javascript文件。 Whenever i click the submit button without selecting data from the radio buttons, the alert message "Please fill out all fields" does not show. 每当我单击提交按钮而不从单选按钮中选择数据时，警告消息“请填写所有字段”都不会显示。
my code of index.php 我的index.php代码
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="script.js"></script>
<script>
$(document).ready(function() {
setInterval(function(){
_path = $('img').attr('src');
_img_id = _path.replace('img/img', '');
_img_id = _img_id.replace('.jpg', '');
_img_id++;
$('img').attr('src', 'img/img' + _img_id + '.jpg');
}, 15000);
});
</script>
</head>
<body id="page-top">
<header>
<h1><img src="img/img1.jpg" alt="image" style="width:738px;height:444px;"></h1>
<hr>
<label>Alignment: </label>
<input type="radio" name="group1" value="5"> 5
<input type="radio" name="group1" value="4"> 4
<input type="radio" name="group1" value="3"> 3
<input type="radio" name="group1" value="2"> 2
<input type="radio" name="group1" value="1"> 1
<hr>
<label>Blend: </label>
<input type="radio" name="group2" value="5"> 5
<input type="radio" name="group2" value="4"> 4
<input type="radio" name="group2" value="3"> 3
<input type="radio" name="group2" value="2"> 2
<input type="radio" name="group2" value="1"> 1
<hr>
<label>Warp: </label>
<input type="radio" name="group3" value="5"> 5
<input type="radio" name="group3" value="4"> 4
<input type="radio" name="group3" value="3"> 3
<input type="radio" name="group3" value="2"> 2
<input type="radio" name="group3" value="1"> 1
<hr>
<label>Overall: </label>
<input type="radio" name="group4" value="5"> 5
<input type="radio" name="group4" value="4"> 4
<input type="radio" name="group4" value="3"> 3
<input type="radio" name="group4" value="2"> 2
<input type="radio" name="group4" value="1"> 1
<hr>
<input type="submit" id="submit" name="submit" value="Submit">
</header>
</body>
</html>
my code of script.js 我的script.js代码
$(document).ready(function () {
$("#submit").click(function () {
var radio1 = $("input[name=group1]:checked").val();
var radio2 = $("input[name=group2]:checked").val();
var radio3 = $("input[name=group3]:checked").val();
var radio4 = $("input[name=group4]:checked").val();
// Returns successful data submission message when the entered information is stored in database.
var dataString = '&submit1=' + radio1 + '&submit2=' + radio2 + '&submit3=' + radio3 + '&submit4=' + radio4;
if (radio1 == '' || radio2 == '' || radio3 == '' || radio4 == '') {
alert("Please Fill All Fields");
} else {
// AJAX Code To Submit Form.
$.ajax({
type: "POST",
url: "ajaxsubmit.php",
data: dataString,
cache: false,
success: function (result) {
alert(result);
}
});
}
return false;
});
});
3 个解决方案
解决方案1
0 2015-10-24 10:05:10
i just saw they are radios, check for falsy values as well, eg !radio1 || !radio2 我刚刚看到它们是收音机， falsy检查falsy值，例如!radio1 || !radio2 !radio1 || !radio2 etc.. !radio1 || !radio2等。
Specificaly jQuery tries to select a checked radio, but none maybe checked, so the jQuery object is empty, so the .val() will return a falsy value (eg null or undefined ). 具体来说， jQuery尝试选择一个checked单选，但可能没有选中它，因此jQuery对象为空，因此.val()将返回一个falsy值（例如null或undefined ）。
解决方案2
0 2015-10-24 10:17:37
Your html is not conform - see input tag without form tag : 您的html不符合-请参阅没有表单标签的输入标签：
<form onsubmit="yourfunction(); return false;"> ...
or use simply a tag button : 或仅使用标签按钮：
<button id="submit">Submit</button>
解决方案3
0 2015-10-24 12:04:57
You can test radio input for undefined like this https://jsfiddle.net/2Lzo9vfc/6/ 您可以像这样https://jsfiddle.net/2Lzo9vfc/6/测试无线电输入是否未定义
if (radio1 == undefined || radio2 == undefined || radio3 == undefined || radio4 == undefined) {
alert("Please Fill All Fields");
} else {
// AJAX Code To Submit Form.
}
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.