jquery 对表单进行各种赋值

1、文本框赋值

$("#txtBrand").val("21");

2、获取img的src的值

$("#img")[0].src;

3、修改img的src的值

$("#img").attr('src',path);

4、ddl下拉框赋值

$("#ddlUnit").val("");

 5、ddl下拉框取值

$("#ddlProvince option:selected").text();//取文本内容

$("#ddlProvince option:selected").val();//取值

6、已选中内容拼接

function DistrictValue() {
var str = "";
$("input[name='chkDistrict']:checked").each(function (index, item) {
if ($("input[name='chkDistrict']:checked").length - 1 == index) {
str += $(this).val();
} else {
str += $(this).val() + ";";
}
});
$("#hideDistrict").val(str);
}

7、input-radio获取文本

<asp:RadioButton ID="rdoIsSpecialOrder0" GroupName="IsSpecialOrder" Text="否" Checked="true" CssClass="mr20" runat="server" />
<asp:RadioButton ID="rdoIsSpecialOrder1" GroupName="IsSpecialOrder" Text="是" runat="server" />

$(function () {
      $('input:radio[name=IsSpecialOrder]').change(function () {
                //对应的选中后,将执行的其他事件
            });
});
//获取选中的值
if ($('input[name=IsSpecialOrder]:checked').val() == 'rdoIsSpecialOrder1') {
                    IsSpecialOrder = 1;
                }

8、checkbox获取参数

$("input[type='checkbox'][name='dangerousGoods']:checked").length;//获取选中的个数

9、自定义传参,样式循环遍历,获取循环中的list信息

//自定义扩展参数

<input class="cgd_input w120 txtInputparam" type="text" data-colname="Name" data-colid="ColumnID" id="IndustryColumnID" maxlength="20">

            function CheckGoodsInfo() {
var submitParamData= new Array(); //input填空参数 $.each($(".txtInputparam"), function (i, item) { if ($(this).val() != "") { submitParamData.push({ ParamId: $(this).attr("data-colid") , ParamName: $(this).attr("data-colname") , ParamValue: $(this).val() }); } });

              $("#hidProductInfo").val(JSON.stringify(submitParamData));//转为json序列化存储,可以后台或者ashx读取调用

            }

对应ashx后台,接收传值后,给list<T>赋值
string strSale = DataConvert.ToString(context.Request["strSale"]).Trim();//数组
List<SaleModel> _saleModelList = new List<SaleModel>();
_saleModelList = Newtonsoft.Json.JsonConvert.DeserializeObject<List<SaleModel>>(strSaleOrder);

将数组或集合 转换成以逗号分隔的字符串
string[] array = { etr, kdgj, 3454, tyt, gff }; string str=string.Join(",",array);

 10、单选框 radio总结 

<div class="radio-inline">
    <input type="radio"  name="killOrder" id="killOrder1" value="1"/>
    <label for="killOrder1">是</label>
</div>
<div class="radio-inline">
    <input type="radio"  name="killOrder" id="killOrder2" value="0" checked/>
    <label for="killOrder2">否</label>
</div>

1.获取值
$("input[name='killOrder']:checked").val();
$('input:radio:checked').val();
$("input[type='radio']:checked").val();
$(":radio[checked]").each(function(radio){alert($(this).val());

注意:有时attr() 无法起到作用,attr() 与 prop() 的区别详见文章。
https://blog.csdn.net/qq_40015157/article/details/110823718

2.设置第一个radio为选中值:

$('input:radio:first').prop('checked', 'checked');
$('input:radio:first').prop('checked', true);
$('input:radio:first').attr('checked', 'checked');
$('input:radio:first').attr('checked', true);

3.设置最后一个radio为选中值:
$('input:radio:last').prop('checked', 'checked');
$('input:radio:last').prop('checked', true);
$('input:radio:last').attr('checked', 'checked');
$('input:radio:last').attr('checked', true);

4.根据索引值设置任意一个radio为选中值:
$('input:radio').eq(索引值).prop('checked', true);//索引值=0,1,2....
$('input:radio').slice(1,2).prop('checked', true);
$('input:radio').eq(索引值).attr('checked', true);//索引值=0,1,2....
$('input:radio').slice(1,2).attr('checked', true);

5.根据value值设置radio为选中值
$("input:radio[value='2']").prop('checked', true);
$("input[value='1']").prop('checked', true);
$("input:radio[value='2']").attr('checked', true);
$("input[value='1']").attr('checked', true);

6.删除value值为2的radio
$("input:radio[value='2']").remove();

7.删除第几个radio
$("input:radio").eq(索引值).remove();//索引值=0,1,2....
//如删除第3个radio:$("input:radio").eq(2).remove();

8.遍历radio
$('input:radio').each(function(index,domEle){
//写入代码
});

9.修改单选框样式
input[type="radio"] + label::before {
content: "\a0";
display: inline-block;
vertical-align: middle;
width: 15px;
height: 15px;
margin-right: 5px;
border-radius: 50%;
text-indent: .15em;
margin-bottom: 4px;
border: 1px solid #CCCCCC;
}
input[type="radio"]:checked + label::before {
background-color: #4A90E2;
background-clip: content-box;
padding: 2px;
}
input[type="radio"] {
position: absolute;
clip: rect(0, 0, 0, 0);
}
.radio-inline{
padding-left: 0;
}
input[type=radio][disabled]:checked + label::before{
background-color:#CCCCCC;
background-clip: content-box;
padding: 2px;

}
复选框总结 : https://blog.csdn.net/qq_40015157/article/details/110819778
全选反选 :https://blog.csdn.net/qq_40015157/article/details/110661715
https://blog.csdn.net/qq_40015157/article/details/80693777
输入框: https://blog.csdn.net/qq_40015157/article/details/80692543

 11、判断数组的值是否一致,采用最大值和最小值比较  

var arrAreaId = new Array();
//遍历对应选中的input,把值存储到数组中 $(
"input[name='cart_check']:checkbox:checked").each(function () { arrAreaId.push($(this).attr("data-areaId")); })
//判断数组的值是否一致,采用最大值和最小值比较
if (Math.max.apply(null, arrAreaId) === Math.min.apply(null, arrAreaId)) {
//一致
}

 

posted @ 2020-07-18 09:36  long6286  阅读(2032)  评论(0编辑  收藏  举报