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)) {
//一致
}

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM