关于JQ的使用，求助

wuxian2015 2015-05-25 09:06:17
①为什么无法获取到checkbox与radio中的值


②第三、第四个要求怎么写？


1， jQuery获取object对象，如下拉框select对象，单选框radio对象，复选框checkbox对象，文本框text对象；
2， 获取对象值，对于值唯一的元素，如select，radio，text通过get()方法获取value值，对于数据元素，如checkbox通过 each循环获取value值
3， 把以上获得的值，添加到一个p标记中，要求黑体，16号字，每项内容独立一行
4， 把以上获得的值，添加到一个表格中，每项内容作为一列，可添加多行，每行带删除按钮，可做行删除








<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>



<script src="jquery-1.11.3.js"></script>



</head>



<body>









<form>  

<!-- 获取select的selected值 biuuu.com-->  

<select id="selectid"><option value="biuuu_s1">s1</option>  

<option value="biuuu_s2">s2</option>  

<option value="biuuu_s3">s3</option>  

<option value="biuuu_s4">s4</option>  

</select>  

<input type="button" id="sbuttonid" value="获取selected值" /><span id="sresult"></span><br />  

<!-- 获取checkbox的checked值 biuuu.com-->  

<input type="checkbox" name="checkboxid" value="biuuu_c1" />c1<input type="checkbox" name="checkboxid" value="biuuu_c2" />c2<input type="checkbox" name="checkboxid" value="biuuu_c3" />c3<input type="checkbox" name="checkboxid" value="biuuu_c4" />c4<input type="button" id="cbuttonid" value="获取checkbox值" /><span id="cresult"></span><br />  

<!-- 获取radio的checked值 biuuu.com-->  

<input type="radio" name="radioid" value="biuuu_r1" />r1<input type="radio" name="radioid" value="biuuu_r2" />r2<input type="radio" name="radioid" value="biuuu_r3" />r3<input type="button" id="rbuttonid" value="获取radio值" /><span id="rresult"></span><br />  

<!-- 获取text的value值 biuuu.com-->  

<input type="text" id="textid" value="" /><input type="button" id="tbuttonid" value="获取text值" /><span id="tresult"></span></form> 





<script type="text/javascript">





$(document).ready(function(){  

  

$("#sbuttonid").click(function(){//获取select对象  

var selectedobj = $("#selectid option:selected");//获取当前selected的值  

var selected = selectedobj.get(0).value;$("#sresult").html("结果:"+selected);  

});  

  

$("#cbuttonid").click(function(){//获取checkbox对象  

var check = '';  

var checkedobj = $("checkboxid");//获取当前checked的value值 如果选中多个则循环 

//$("[name='checkboxid'][@checked]")

checkedobj.each(function(){var ischeck = this.value;check += ischeck;  

});  

$("#cresult").html("结果:"+check);  

});  

  

$("#rbuttonid").click(function(){//获取radio对象  

var radioobj = $("[name='radioid'][@checked]");//获取当前checked的value值  

var radio = radioobj.get(0).value;$("#rresult").html("结果:"+radio);  

});  

  

$("#tbuttonid").click(function(){//获取text对象  

var textobj = $("#textid");//获取当前text的value值  

var text = textobj.get(0).value;$("#tresult").html("结果:"+text);  

});  

});



</script>

















</body>

</html>
...全文
191 11 打赏 收藏 转发到动态 举报
写回复
用AI写文章
11 条回复
切换为时间正序
请发表友善的回复…
发表回复
wuxian2015 2015-06-02
  • 打赏
  • 举报
 回复
把以上获得的值，添加到一个表格中，每项内容作为一列，可添加多行，每行带删除按钮，可做行删除
wuxian2015 2015-06-02
  • 打赏
  • 举报
 回复
表格功能怎么写好点
wudichaoren2010 2015-05-28
  • 打赏
  • 举报
 回复
改好了
wudichaoren2010 2015-05-28
  • 打赏
  • 举报
 回复 


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>LJ</title>

<script src="jquery-1.6.1.min.js"></script>

</head>

<body>




<form>  
<!-- 获取select的selected值 -->  
<select id="selectid"><option value="s1">s1</option>  
<option value="s2">s2</option>  
<option value="s3">s3</option>  
<option value="s4">s4</option>  
</select>  
<input type="button" id="sbuttonid" value="获取selected值" /><span id="sresult"></span><br />  
<!-- 获取checkbox的checked值 -->  
<input type="checkbox" name="checkboxid" value="c1" />c1<input type="checkbox" name="checkboxid" value="c2" />c2<input type="checkbox" name="checkboxid" value="c3" />c3<input type="checkbox" name="checkboxid" value="c4" />c4<input type="button" id="cbuttonid" value="获取checkbox值" /><span id="cresult"></span><br />  







<!-- 获取radio的checked值 -->  



<input type="radio" name="radioid" value="r1" />r1<input type="radio" name="radioid" value="r2" />r2<input type="radio" name="radioid" value="r3" />r3<input type="button" id="rbuttonid" value="获取radio值" /><span id="rresult"></span><br />  






<!-- 获取text的value值 -->  
<input type="text" id="LJtextid" value="" /><input type="button" id="tbuttonid" value="获取text值" /><span id="tresult"></span></form> 


<script type="text/javascript">


$(document).ready


(

	function()
	{  
	  
		$("#sbuttonid").click
		(
			function()
			{//获取select对象  
				var selectedobj = $("#selectid option:selected");//获取当前selected的值  
				var selected = selectedobj.get(0).value;$("#sresult").html("结果:"+selected);  
			}
		);  
  
	$("#cbuttonid").click(function(){//获取checkbox对象  
var check = ''; 
 var checkedobj = $("[name='checkboxid']:checked");
//var checkedobj = $("checkboxid");
//获取当前checked的value值 如果选中多个则循环 
//$("[name='checkboxid'][@checked]")
checkedobj.each(function(){var ischeck = this.value;check += ischeck;  
});  
$("#cresult").html("结果:"+check);  
}); 




 



$("#rbuttonid").click(
function(){//获取radio对象 
//$("#rbuttonid").click(function(){
    //获取radio对象  
    //var radioobj = $("[name='rbuttonid']:checked");
var radioobj = $("[name='radioid']:checked");
//获取当前checked的value值  
var radio = radioobj.get(0).value;$("#rresult").html("结果:"+radio);  
});  


  
$("#tbuttonid").click
(
	function()
	{//获取text对象  
		var textobj = $("#LJtextid");//获取当前text的value值  
		var text = textobj.get(0).value;$("#tresult").html("结果:"+text);  
	}
);  

		$("#adp").click
		(
			function()
			{
				 var selectedobj = $("#selectid option:selected");//获取当前selected的值
				 var check = ''; 
 var checkedobj = $("[name='checkboxid']:checked");
//var checkedobj = $("checkboxid");
//获取当前checked的value值 如果选中多个则循环 
//$("[name='checkboxid'][@checked]")
checkedobj.each(function(){var ischeck = this.value;check += ischeck;}); 
var radioobj = $("[name='radioid']:checked");
//获取当前checked的value值  
var radio = radioobj.get(0).value;
var textobj = $("#LJtextid");//获取当前text的value值  
		var text = textobj.get(0).value;
				str=selectedobj.get(0).value+"<br />"+check+"<br />"+radio+"<br />"+text;
				$('p').append(str+'<br/>');
			}
		);
		
		
		$("#AddTable").click
(
	function()
	{
		
		 var check = ''; 
 var checkedobj = $("[name='checkboxid']:checked");
//var checkedobj = $("checkboxid");
//获取当前checked的value值 如果选中多个则循环 
//$("[name='checkboxid'][@checked]")
checkedobj.each(function(){var ischeck = this.value;check += ischeck;}); 
var radioobj = $("[name='radioid']:checked");
//获取当前checked的value值  
var radio = radioobj.get(0).value;
var textobj = $("#LJtextid");//获取当前text的value值  
		var text = textobj.get(0).value;
		
		
		 var selectedobj = $("#selectid option:selected");
		var str1=selectedobj.get(0).value;
		var str2=check;
		var str3=radio;
		var str4=text;
		$('table tbody').append('<tr><td>'+str1+'</td></tr>'  + '<tr><td>'+str2+'</td></tr>' +'<tr><td>'+str3+'</td></tr>' + '<tr><td>'+str4+'</td></tr>')
	}
);  


	}
);

</script>

<p style="font-size:16px; font-family:'黑体'"></p>

<input type="button" id="adp" value="加上P标签" />

<table width="200" border="1">
<tbody>
</tbody>
</table>
<input type="button" id="AddTable" value="加上表格" />



</body>
</html>
wuxian2015 2015-05-28
  • 打赏
  • 举报
 回复
单选按钮radio无效
wuxian2015 2015-05-25
  • 打赏
  • 举报
 回复 


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>LJ</title>

<script src="jquery-1.11.3.js"></script>

</head>

<body>




<form>  
<!-- 获取select的selected值 -->  
<select id="selectid"><option value="s1">s1</option>  
<option value="s2">s2</option>  
<option value="s3">s3</option>  
<option value="s4">s4</option>  
</select>  
<input type="button" id="sbuttonid" value="获取selected值" /><span id="sresult"></span><br />  
<!-- 获取checkbox的checked值 -->  
<input type="checkbox" name="checkboxid" value="c1" />c1<input type="checkbox" name="checkboxid" value="c2" />c2<input type="checkbox" name="checkboxid" value="c3" />c3<input type="checkbox" name="checkboxid" value="c4" />c4<input type="button" id="cbuttonid" value="获取checkbox值" /><span id="cresult"></span><br />  
<!-- 获取radio的checked值 -->  
<input type="radio" name="radioid" value="biuuu_r1" />r1<input type="radio" name="radioid" value="biuuu_r2" />r2<input type="radio" name="radioid" value="biuuu_r3" />r3<input type="button" id="rbuttonid" value="获取radio值" /><span id="rresult"></span><br />  
<!-- 获取text的value值 -->  
<input type="text" id="LJtextid" value="" /><input type="button" id="tbuttonid" value="获取text值" /><span id="tresult"></span></form> 


<script type="text/javascript">


$(document).ready


(

	function()
	{  
	  
$("#sbuttonid").click(function(){//获取select对象  
var selectedobj = $("#selectid option:selected");//获取当前selected的值  
var selected = selectedobj.get(0).value;$("#sresult").html("结果:"+selected);  
});  
  
$("#cbuttonid").click(function(){//获取checkbox对象  
var check = ''; 
 var checkedobj = $("[name='checkboxid']:checked");
//var checkedobj = $("checkboxid");
//获取当前checked的value值 如果选中多个则循环 
//$("[name='checkboxid'][@checked]")
checkedobj.each(function(){var ischeck = this.value;check += ischeck;  
});  
$("#cresult").html("结果:"+check);  
});  
 $("[name='rbuttonid']:checked").click(function(){//获取radio对象 
//$("#rbuttonid").click(function(){
	//获取radio对象  
	//var radioobj = $("[name='rbuttonid']:checked");
var radioobj = $("[name='radioid'][@checked]");
//获取当前checked的value值  
var radio = radioobj.get(0).value;$("#rresult").html("结果:"+radio);  
});  
  
$("#tbuttonid").click
(
	function()
	{//获取text对象  
		var textobj = $("#LJtextid");//获取当前text的value值  
		var text = textobj.get(0).value;$("#tresult").html("结果:"+text);  
	}
);  

		$("#adp").click
		(
			function()
			{
				 var selectedobj = $("#selectid option:selected");//获取当前selected的值
				str=selectedobj.get(0).value;
				$('p').append(str+'<br/>')
			}
		);
		
		
		$("#AddTable").click
(
	function()
	{
		 var selectedobj = $("#selectid option:selected");
		str=selectedobj.get(0).value;
		$('table tbody').append('<tr><td>'+str+'</td></tr>')
	}
);  


	}
);

</script>

<p></p>

<input type="button" id="adp" value="加上P标签" />

<table>
<tbody>
</tbody>
</table>
<input type="button" id="AddTable" value="加上表格" />



</body>
</html>
单选按钮radio无效
wuxian2015 2015-05-25
  • 打赏
  • 举报
 回复 


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>

<script src="jquery-1.11.3.js"></script>

</head>

<body>




<form>  
<!-- 获取select的selected值 biuuu.com-->  
<select id="selectid"><option value="s1">s1</option>  
<option value="s2">s2</option>  
<option value="s3">s3</option>  
<option value="s4">s4</option>  
</select>  
<input type="button" id="sbuttonid" value="获取selected值" /><span id="sresult"></span><br />  
<!-- 获取checkbox的checked值 -->  
<input type="checkbox" name="checkboxid" value="c1" />c1<input type="checkbox" name="checkboxid" value="c2" />c2<input type="checkbox" name="checkboxid" value="c3" />c3<input type="checkbox" name="checkboxid" value="c4" />c4<input type="button" id="cbuttonid" value="获取checkbox值" /><span id="cresult"></span><br />  
<!-- 获取radio的checked值 biuuu.com-->  
<input type="radio" name="radioid" value="biuuu_r1" />r1<input type="radio" name="radioid" value="biuuu_r2" />r2<input type="radio" name="radioid" value="biuuu_r3" />r3<input type="button" id="rbuttonid" value="获取radio值" /><span id="rresult"></span><br />  
<!-- 获取text的value值 biuuu.com-->  
<input type="text" id="textid" value="" /><input type="button" id="tbuttonid" value="获取text值" /><span id="tresult"></span></form> 


<script type="text/javascript">


$(document).ready(function(){  
  
$("#sbuttonid").click(function(){//获取select对象  
var selectedobj = $("#selectid option:selected");//获取当前selected的值  
var selected = selectedobj.get(0).value;$("#sresult").html("结果:"+selected);  
});  
  
$("#cbuttonid").click(function(){//获取checkbox对象  
var check = ''; 
 var checkedobj = $("[name='checkboxid']:checked");
//var checkedobj = $("checkboxid");
//获取当前checked的value值 如果选中多个则循环 
//$("[name='checkboxid'][@checked]")
checkedobj.each(function(){var ischeck = this.value;check += ischeck;  
});  
$("#cresult").html("结果:"+check);  
});  
 $("[name='rbuttonid']:checked").click(function(){//获取radio对象 
//$("#rbuttonid").click(function(){
	//获取radio对象  
	//var radioobj = $("[name='rbuttonid']:checked");
var radioobj = $("[name='radioid'][@checked]");
//获取当前checked的value值  
var radio = radioobj.get(0).value;$("#rresult").html("结果:"+radio);  
});  
  
$("#tbuttonid").click(function(){//获取text对象  
var textobj = $("#textid");//获取当前text的value值  
var text = textobj.get(0).value;$("#tresult").html("结果:"+text);  
});  
});

</script>








</body>
</html>
单选radio 还是没效果
娃都会打酱油了 2015-05-25
  • 打赏
  • 举报
 回复
3就是$('p').append(str+'<br/>') 4就是$('table tbody').append('<tr><td>'+str+'</td></tr>')
wuxian2015 2015-05-25
  • 打赏
  • 举报
 回复
引用 2 楼 starfd 的回复:
var checkedobj = $("[name='checkboxid']:checked");
$("[name='rbuttonid']:checked").click(function(){//获取radio对象
3， 把以上获得的值，添加到一个p标记中，要求黑体，16号字，每项内容独立一行 4， 把以上获得的值，添加到一个表格中，每项内容作为一列，可添加多行，每行带删除按钮，可做行删除 大神这两个要求怎么写？
娃都会打酱油了 2015-05-25
  • 打赏
  • 举报
 回复 
var checkedobj = $("[name='checkboxid']:checked");
$("[name='rbuttonid']:checked").click(function(){//获取radio对象
wuxian2015 2015-05-25
  • 打赏
  • 举报
 回复
求助啊
jQuery使用DataTable实现删除数据后重新加载功能
问题描述： 利用jQuery Datatable和artTemplate组合来做的表格。但是当删除数据时，需要重新加载table里的数据。但是问题是datatable并没有直接的重新渲染，反而给数据累加上了。 解决办法： 经过查看高人的blog，发现可以先销毁table，然后再重新渲染。 var dttable; App.globalAjax("get", "/Order/MyJsonList", {}, function (result) { 　 var html = template('Orders-template', result); $("#datatable1").find(
jquery html动态生成select标签出问题的解决方法
今天用jquery,用json从后台获取一个列表,准备在前台用一个动态生成的select标签显示出来… 结果一直不能显示,动态生成input,a 都是可以的 最后随便的在select前面敲了一堆11111111111111111111111 然后select出现了 怀疑可能跟空格有关,加了个 在select前面,没反应 之后又尝试了各种方法,还是不行 再从搜狗浏览器换成IE,FIREFOX, 没问题了 才发现是浏览器问题….浪费了3个多小时,无语了 搜狗浏览器也比较坑啊….哎 以后坚决不去当前台
jquery中animate动画积累的解决方法
昨天一同学向我求助，说做了一个简单的动画效果，就是图片自动左右播放 代码如下: /* 无缝式焦点图 */ var _left = 770; var left = -_left;//-770 function slideImg() { if(left == -3080 || left == 0) { _left = -_left; } $(‘.slidepics’).animate({‘left’: left + ‘px’},1000); left = left – _left; tim = setTimeout(sl
jq（jq）实现对html标签（元素）动态添加onclick事件
原本很简单的一个功能，却花了我1天时间，所以很有必要记下来 原因是我采用了jq，而网站是采用一款名为SuperSlider的jq插件，这个插件会导致onclick里的事件会自动触发 通常实现方法 <h1 id="one">这是一个标签</h1> 1、jq jq实现给元素动态添加onclick方法有on和attr以及其他 （1）on jq1.7版本会报错：“on is not a function” ，百度过都说用1.8的版本，因此我改用1.8.3版本的jq库，完美运行 JQ <
jq-选择器
一、jq的介绍 做什么？作用 用更少的代码，解决更多的需求 可以不用 个人建议：现阶段jq能不用就不用 学习，原生，基础 jq惯坏 jquery其实就是别人封装好的函数，有很多功能，可以直接使用，不用考虑原理 怎么做？语法 学习的内容 ...
JavaScript

87,955

社区成员

224,621

社区内容

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章