posts - 60,comments - 71,trackbacks - 0

      如果我们要取得所选中的单选按钮中的值是很容易的事,如要取得下面单选按钮中的:130000 或 160000,是件很容易的事,但要取得:aaaa 或 bbbb,
且aaaa和bbbb是从数据库中动态取得的,也就是说,单选按钮组是动态生成的,然后页面上点击某个按钮时,要获取所选中的单选按钮中的类似aaaa这样的内容,这样就比较难了,如下:

<input type="radio" name="item" value="130000" onclick="update(this.value)">aaaa</input>
<input type="radio" name="item" value="160000" onclick="update(this.value)">bbbb</input>

      经过本人的思考,想到了一种变通的办法,即将从数据库中动态获取的内容赋给单选按钮的title属性,然后获取的时候,循环单选按钮组,获取选中的单选按钮的title属性值,赋给一变量,这样就得到了类似aaaa内容了,即取到了单选按钮中显示的内容.

     将从数据库中获取到的内容赋给title属性

<input type="radio" name="item" value="130000" onclick="update(this.value)" title='"+aaa+"'>aaaa</input>
<input type="radio" name="item" value="160000" onclick="update(this.value)" title='"+bbbb+"'>bbbb</input>

注:这里的单选按钮组和通常的单选扭钮组有些不同的地方
1)是根据数据库中获取到的内容动态生成的;
2)单选按钮的value属性值是数字,不是字符串,因为要根据当前某一单选按钮的单击事件,用当前单选按钮的值(130000,数据库表中某一字段的ID值)去从数据库中获取相关内容,生成下一个动态的单选按钮组,否则的话,可以直接将从数据库中获取到的内容赋给value属性.

另:也许有人会说可以用select下拉列表来解决,就不用这么麻烦了,是的,本人最开始想到的也是用select来解决,但客户有个变态的需求,也就是要显示的aaaa,bbbb这样的内容非常长,大约有一,二千的汉字,所以就没用select下拉列表来显示了,因为显示不下,后来就想到用radio来解决了.
posted on 2008-11-04 11:15 henry1451 阅读(2524) 评论(9)  编辑  收藏

FeedBack:
# re: 取得单选按钮中显示的内容
2008-11-04 20:30 | 昨夜流星

如果使用radio的title,每当鼠标经过的时候就会显示title的内容,这样给人的感觉也是不好的,呵呵,其实我建议使用DOM取值:

 1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2<html xmlns="http://www.w3.org/1999/xhtml">
 3<head>
 4<meta http-equiv="Content-Type" content="text/html; charset=GBK" />
 5<title>无标题文档</title>
 6<script type="text/javascript">
 7    function onRadioClick(eleRadio){
 8        alert(eleRadio.nextSibling.nodeValue);
 9    }

10
</script>
11</head>
12
13<body>
14<form id="form1" name="form1" method="post" action="">
15  <input type="radio" onclick="onRadioClick(this)" name="radio" id="radio" value="radio"/>
16dfasdfsadfasdfasdfasdfasdfsadfsdfasdfsdfsdafsdfsadfadsfsadfsadfsdafsadfsadfsadfasdfasfsadfsadfsdaf
17</form>
18</body>
19</html>
20


 

  回复  更多评论
  
# re: 取得单选按钮中显示的内容[未登录]
2008-11-05 08:58 | henry1451
@昨夜流星:
呵呵,这个思路也不错,用到了控件的 nextSibling 和 nodeValue 属性,这样取值也更方便些,不用去循环单选按钮组了.  回复  更多评论
  
# re: 取得单选按钮中显示的内容
2008-11-05 09:46 | 昨夜流星
  回复  更多评论
  
# re: 取得单选按钮中显示的内容
2008-11-05 10:41 | ✿❀
呵呵,这样干还不了解JavaScript ,给radio 定义一个属性,比如<input type=radio extValue='aaaa'/> 以后,去它的值,就像去value的值一样,啥叫动态弱类型,就是这个意思了  回复  更多评论
  
# re: 取得单选按钮中显示的内容
2008-11-05 10:42 | ✿❀
一楼的也有局限,如果radio 内部有复杂的html 你的办法就失效了  回复  更多评论
  
# re: 取得单选按钮中显示的内容
2008-11-05 12:48 | Hafeyang
我认为是这样的:
<label for="radio1">your label text</label>
<input type="radio" id="radio1" />

//jquery
$("label[for= radio1]").text();  回复  更多评论
  
# re: 取得单选按钮中显示的内容
2008-11-05 13:12 | 昨夜流星
@✿❀
要考虑一下浏览器兼容问题,这样做IE下是可以,但是FireFox不支持!  回复  更多评论
  
# re: 取得单选按钮中显示的内容
2008-11-05 13:21 | 昨夜流星
来一个支持HTML标签的:
<!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=GBK" />
 
<title>无标题文档</title>
 
<script type="text/javascript">
     
function onRadioClick(eleRadio){
         alert(eleRadio.nextSibling.innerHTML);
     }

</script>
</head>

<body>
<form id="form1" name="form1" method="post" action="">
  
<input type="radio" onclick="onRadioClick(this)" name="radio" id="radio" value="radio"/><span>
dfasdfsadfasdfasdfasdfasdf
<BR />sadfsdfasdfsdfsdafsdfsadf<font color="#FF0000">adsfsadfsadfsdafsadfsad</font>fsadfasdfasfsadfsadfsdaf
</span>
</form>
</body>
</html>
  回复  更多评论
  
# re: 取得单选按钮中显示的内容[未登录]
2008-11-05 15:23 | henry1451
谢谢大家的回复,让我在这个问题上有了更广阔的思路!  回复  更多评论
  

只有注册用户登录后才能发表评论。


网站导航: