您的位置：首页 > Web前端 > JQuery

jquery获取动态添加的combobox已选中的text

2014-07-03 14:36 369 查看
本人easyui菜鸟，调试了一早上，api和百度都快翻烂了，终于试出来了。尼玛好简单我居然花了那么长时间。谨以此文勉励自己，也希望能帮到其他人。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Accordion Actions - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css" href="easyui.css">
<link rel="stylesheet" type="text/css" href="icon.css">
<link rel="stylesheet" type="text/css" href="/demo/demo.css">
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="jquery.easyui.min.js"></script>
</head>
<body>
<input type="button" onclick="cal()" value="统计行数"/>
<input type="button" onclick="print()" value="遍历人员"/>
<table id="principal" width="100%" border="0" cellspacing="1" cellpadding="0" style="background:#BED3DF;">
<thead>
<tr align="center">
<td width="20%">证件类型</td>
<td width="30%">身份证号码</td>
<td width="20%">姓名</td>
<td width="30%">
<img class="add" src="icons/edit_add.png" title="添加自定义主犯（嫌疑犯）"/>
</td>
</tr>
</thead>
<tbody>
<tr class="addPrincipalTr">
<td style="background:white;" align="center">
<select name="cardType" class="easyui-combobox" id="sel" editable="false">
<option value="1">身份证</option>
<option value="2">学生证</option>
</select>
</td>
<td style="background:white;" align="center"><input name="idCard" class="idCard" type="text" value="123243"/></td>
<td style="background:white;" align="center"><input type="text" class="eventPeopleName" name="eventPeopleName" value="name"/></td>
<td style="background:white;" align="center"><img class="" src="icons/pencil.png" title="请填写自定义主犯（嫌疑犯）"/></td>
</tr>
</tbody>
</table>
</body>
<script type="text/javascript">
$(".add").click(function(){
addPrincipal();
return true;
});

$(document).on('click', '.del', function(event){
$(this).parent().parent().remove();
});

function cal(){
var length = $("#principal").find("tr").length-1;
alert(length);
}
var count = 2;
function addPrincipal(){
var trEl = [];
//$('#principal tbody select').combobox({panelHeight:null,width:150});
trEl.push('<tr class="addPrincipalTr">');
trEl.push('<td style="background:white;" align="center">');
trEl.push('<select name="cardType" class="easyui-combobox" editable="false">');
trEl.push('<option value="1">身份证</option><option value="2">学生证</option></select></td>');
trEl.push('<td style="background:white;" align="center"><input type="text" name="idCard" /></td>');
trEl.push('<td style="background:white;" align="center"><input type="text" name="eventPeopleName" /></td>');
trEl.push('<td style="background:white;" align="center">');
trEl.push('<img class="del" src="icons/edit_remove.png" title="删除自定义主犯（嫌疑犯）"/>');
trEl.push('</td>');
trEl.push('</tr>');
$("#principal tbody").append(trEl.join(""));
$.parser.parse($('#principal tbody'));
}

function print(){
$('#principal tbody tr').each(function(){
var cardType = $('select',this).combobox('getText');
//var cardType = $('td', this).eq(1).find('option:selected').text();
var card2 = $('td', this).eq(1);

var idCard = $('input[name=idCard]',this).val();
var name = $('input[name=eventPeopleName]',this).val();
alert(name+"的"+cardType+"为:"+idCard);
});
}
</script>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航