您好我需要创建一个带有两个单选按钮的表单是和否使用提交按钮,如果用户没有选择任何选项,则应弹出警告说“请选择一个选项'”如果是并提交按钮jquery对话框应弹出对话框中的两个按钮确定并取消 - >如果用户单击确定然后它应该转到不同的页面,如果没有单选按钮和提交按钮,那么还应该弹出一个对话框,具有相同的确定和取消按钮,如果确定则应该转到另一个页面。我已经创建了类似的东西,但却无法提供所选的单选按钮
<form action="" method="get" name="radval">
<table width="100">
<tr>
<td width="41"><input name="xyz" type="radio" id="yes_chk" value="" required>
Yes</td>
<td width="47"><input name="xyz" type="radio" id="yes_chk" value="" required>
No</td>
</tr>
<tr>
<td colspan="4"><input type="submit" value="Submit" id="button"></td>
</tr>
</table></form>
的javascript
<script src="js/jquery.reveal.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#button').click(function(e) { // Button which will activate our modal
$('#modal').reveal({ // The item which will be opened with reveal
animation: 'fade', // fade, fadeAndPop, none
animationspeed: 600, // how fast animtions are
closeonbackgroundclick: true, // if you click background will modal close?
dismissmodalclass: 'close' // the class of a button or element that will close an open modal
});
return false;
});
});
</script>
如何根据所选的单选按钮重定向页面。我是jquery的新手,有什么帮助吗?
提前致谢。
答案 0 :(得分:0)
我重新创建了一下,在评论中你可以看到解释的代码:
你的HTML有点调整
<form action="" method="get" name="radval" data-sjaak-module="sjaak.mod.form">
<input name="yes-no" type="radio" class="yes_chk" value="yes">Yes
<input name="yes-no" type="radio" class="no_chk" value="no">No
<input type="submit" value="submit" id="button">
</form>
$('#button').click(function(e) { // Button which will activate our modal e.preventDefault(); // prevent submitting and go trough the list below var x = !$('.yes_chk').is(':checked'), // declaring variables it checks for the class yes_chk if it isn't checked y = !$('.no_chk').is(':checked') if (x && y) { // the condition if both fields are unchecked alert('Make a choice'); // alert box that pops up if there is no choice made } else if (x) { // if just x is not checked var no = confirm('you checked no'); // putting it in a variable to use it in a later if if(no == true) { // if clicked on ok do the following parent.location='http://www.stackoverflow.com/'; } else { // if clicked on cancel what to do console.log('false'); parent.location='http://stackoverflow.com/questions/15197403/form-with-two-radio-buttons-using-jquery-dialogbox'; } } else { var yes = confirm('you checked yes'); if(yes == true) { // if condition is met than parent.location='http://www.stackoverflow.com/'; // go to this website } else { // if cancel is pressed do the following parent.location='http://stackoverflow.com/questions/15197403/form-with-two-radio-buttons-using-jquery-dialogbox'; } } // your code just below $('#modal').reveal({ // The item which will be opened with reveal animation: 'fade', // fade, fadeAndPop, none animationspeed: 600, // how fast animtions are closeonbackgroundclick: true, // if you click background will modal close? dismissmodalclass: 'close' // the class of a button or element that will close an open modal }); return false; });