jqeury+ajax中单选按钮的监听

最新推荐文章于 2023-12-22 17:30:21 发布

原创最新推荐文章于 2023-12-22 17:30:21 发布 · 681 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#ajax

收录于

本文展示了一个使用JSP实现的请假申请表单，通过单选按钮和文本输入收集请假类型，包括事假、病假和其他，并利用Ajax进行异步提交。文章详细介绍了HTML结构、JavaScript监听和Ajax数据发送过程。

jsp:
 <label class="control-label" style="width: 100px">请假事由：</label>
  <input name="radio" type="radio" class="raido-btn" id="shijia" value="coral1" />
  <label for="coral1">事假</label>
  <input name="radio" type="radio" class="raido-btn" id="bingjia" value="coral2" />
  <label for="coral2">病假</label>
  <label>其它：<input name="cause1" id="cause1" type="text" style="font-size: 14px;width:246px;"></label>

ajax:function shenqing() {

		/*单选按钮的监听 */
		var cause;
		
		if($('#shijia').prop('checked')){
	        cause = '事假';
	    }
	    else if($('#coral2').prop('checked')){
	    	cause = '病假';
	    }
	    else {
	    	cause = $("#cause1").val();
	    }
		

		$.ajax({

			url : "../user/shenqing",
			type : "post",
			data : {
			
				"cause" : cause;
			},
			async : false,
			datatype : 'json',
			success : function(data) {

				var status = data.status;

				if (status == 1) {
					alert("插入成功！ ");
				}

			}
		})
	}