有这样写JS的同学吗?感觉很不地道,放上来肯定会被喷的。里面还插入了php代码,但是我需要的功能都实现了!哇哈哈@

本文介绍了一个使用JavaScript和PHP实现的动态表单案例,该案例中通过JavaScript处理用户交互,如显示隐藏文本框、收集单选或多选输入等,并通过PHP进行服务器端的数据处理。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

有这样写JS的同学吗?感觉很不地道,放上来肯定会被喷的。里面还插入了php代码,但是我需要的功能都实现了!哇哈哈@

点击下拉框,单选,多选右边会出现文本框,得到焦点值清空。失去焦点时值保存给隐藏域,同时也有默认值。

如果是点击文本,图片,请选择右边文本框会消失,同时值清空。

最后把需要的值拼接起来。


<script>
$(document).ready(function(){
//获取checkbox里面的值
var num_field = [];
$("#submit").live('click',function(){  
	$("input[name=checkboxes]:checked").each(function(){
		if($(this).attr("checked")){
			num_field.push( ($(this).val()) );
		}									   
	});
   /* for(var i=0;i<num_field.length;i++){
		alert(num_field[i]);
       }*/
	var ajax_data =  num_field.join('|'); 
	$('#newfileds').val(ajax_data);
}) 

<?php for($i=1;$i<4;$i++): ?>
$("#field_type<?php echo $i; ?>").change('click',function() {
 jQuery('option:selected', this).each(function(){
     var retain<?php echo $i; ?> = this.value;
     $('#retain<?php echo $i; ?>').val(retain<?php echo $i;?>);
	 if(this.value == 'retain<?php echo $i; ?>-wenben|' || this.value == 'retain<?php echo $i; ?>-pic|' || this.value== ''){
	 $('#danxuan<?php echo $i; ?>').val("");
	 $('#danxuan<?php echo $i; ?>').css("display","none"); //为文本和图片的时候隐藏
	 }
	 if(this.value == 'retain<?php echo $i; ?>-danxuan|' || this.value == 'retain<?php echo $i; ?>-danxuan-'){ //判断保留值为单选
	 $('#danxuan<?php echo $i; ?>').css("display","");       //为单选清空下文本框显示
	 var v = this.value;
	  v = 'retain<?php echo $i; ?>-danxuan-'; 
	    $('#danxuan<?php echo $i; ?>').val("1是_2否");   //设置默认值
		
	 $('#danxuan<?php echo $i; ?>').focus(function(){ //得到焦点值清空
	   $('#danxuan<?php echo $i; ?>').val("");        //获取单选框的值
	  
	 })
	  $('#danxuan<?php echo $i; ?>').blur(function(){ //失去焦点时值保存
	   var ch = $('#danxuan<?php echo $i; ?>').val();
	   var y = v + ch +'|';      //不为默认值
	   $('#retain<?php echo $i; ?>').val(y);
	 })
  
	var y = v + $('#danxuan<?php echo $i; ?>').val() +'|';
      $('#retain<?php echo $i; ?>').val(y);
	 }
	 
	 
	 if(this.value == 'retain<?php echo $i; ?>-duoxuan|' || this.value == 'retain<?php echo $i; ?>-duoxuan-'){   //为多选的情况
	 $('#danxuan<?php echo $i; ?>').css("display",""); 
	  var v = this.value;
	  v = 'retain<?php echo $i; ?>-duoxuan-';
	 $('#danxuan<?php echo $i; ?>').val("1_2_3_4_5_6_7_8");
	 
	 $('#danxuan<?php echo $i; ?>').focus(function(){ //得到焦点值清空
	   $('#danxuan<?php echo $i; ?>').val("");
	  
	 })
	  $('#danxuan<?php echo $i; ?>').blur(function(){ //失去焦点时值保存
	   var ch = $('#danxuan<?php echo $i; ?>').val();
	   var y = v + ch +'|';      //不为默认值
	   $('#retain<?php echo $i; ?>').val(y); //失去焦点值保留
	 })	 
	 
	 
	 var y = v + $('#danxuan<?php echo $i; ?>').val()+'|'; 
      $('#retain<?php echo $i; ?>').val(y);     //默认值保留
	 }
	 if(this.value == 'retain<?php echo $i; ?>-xialakuang|' || this.value == 'retain<?php echo $i; ?>-xialakuang-'){   //为下拉框的情况下
	 $('#danxuan<?php echo $i; ?>').css("display","");	 
	  var v = this.value;
	  v = 'retain<?php echo $i; ?>-xialakuang-';
	 $('#danxuan<?php echo $i; ?>').val("1_2_3_4_5_6"); //下拉框默认值
	 
	 $('#danxuan<?php echo $i; ?>').focus(function(){ //得到焦点值清空
	   $('#danxuan<?php echo $i; ?>').val("");
	  
	 })
	  $('#danxuan<?php echo $i; ?>').blur(function(){ //失去焦点时值保存
	   var ch = $('#danxuan<?php echo $i; ?>').val();
	   var y = v + ch +'|';      //不为默认值
	   $('#retain<?php echo $i; ?>').val(y);
	  
	 })
	 	 
	 var y = v + $('#danxuan<?php echo $i; ?>').val()+'|';
      $('#retain<?php echo $i; ?>').val(y);  //值保存为隐藏域
	 }
 });
});
<?php endfor; ?>

});
</script>

我需要的值:

已插入数据表:



OK!!!


评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值