1.table行单击选中radio(传说中input[type=radio]比input:radio要快)
<tr class="rowSelect">
<td>
<input type="radio" name="addressOptions" id="opt{{:ID}}"
value="22">
</td>
<td style="color:red;">默认</td>
<td>AA</td>
</tr>
$("tr.rowSelect").click(function () {
$(this).find("input[type=radio]").prop("checked", true);
});
这里用.prop("checked",true)。而不用.attr("checked","checked")。后者在某些浏览器(chrome)只能点一次，而且点过之后点其他行，不会取消checked。
同checkBox，要用prop不能用attr。attr效果一次性。
2.判断checked是否选中
$("#DefaultFlag").is(":checked")
3.得到radio的值(一般多个radio有相同的name)
$("input[name='addressOptions']:checked").val()
4.获取id值(后面的substring截取字符串)
$(this).attr("id").substring(4)
5.修改button的text
$("#btnA").text("修改地址并返回");
6.cxSelect控件实现地区的多级联动。
赋值时(前两个调用trigger，否则下拉列表不变，可能找不到值)：
if ($("#Province").val() != item.Province) {
$("#Province").val(item.Province);
$("#Province").trigger("change");
}
if ($("#City").val() != item.City) {
$("#City").val(item.City);
$("#City").trigger("change");
}
$("#Town").val(item.Town);
7.ajax传递Token
- 前台页面有地方声明一个(多个)Token
@Html.AntiForgeryToken()
- 后台action的特性声明[ValidateAntiForgeryToken]
- 前台ajax调用时，在传递的参数里面
$.post("/Controller/Action"
, {
id: id,
__RequestVerificationToken: getToken()
}
, function (data) {
});
function getToken() {
return $("input[name='__RequestVerificationToken']").val();
}
getToken获取页面的所有input的name为__RequestVerificationToken的对象的值(一个到多个)，传递到后台。
※这里小测试：如果页面已有一个地方声明了Token，其他的地方不声明也可以。但至少有一个，也必须传递到服务器，否则ajax操作不会执行。form的submit后面的逻辑是怎样？？
8. 整数/浮点 保留小数位
totalFee.toFixed(2)
9. 对象的父元素 + 删除元素
$(clickTd).parent().parent().remove();
10. 赋值同时调用$(selector).change(function(){}).change()
$( "input" ).change(function() {
var $input = $( this );
$( "p" ).html(
".attr( \"checked\" ): <b>" + $input.attr( "checked" ) + "</b> <br>" +
".prop( \"checked\" ): <b>" + $input.prop( "checked" ) + "</b><br>" +
".is( \":checked\" ): <b>" + $input.is( ":checked" ) ) + "</b>";
}).change();
11. 一行内显示的内容，如果文字太长就隐藏，不要自动换行，也不要自动宽度.
.oneRow {
display: inline-block;
float: left;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
/*width: 120px;*/
width: 97%;
}
上面的代码是一个样式，不局限于span的样式，也可以作为一个div的样式。
<div class="oneRow">
<label>
<input type="checkbox" />
AAAAAAAA
</label>
<span title="DCSDCSDC">DCSDCSDC</span>
<span style="margin-right:30px"></span>
<label style="margin-bottom:0;">SDFSDDDD:</label>
<span title="XXXXXXX">XXXXXXX</span>
<span style="margin-right:20px"></span>
<label style="margin-bottom:0;">kkkkkkkk:</label>
<span title="fffff">FFFFF</span>
</div>
<div class="pull-right">
<a onclick="alert('hhhhh')" style="font-size:20px;color:gray;"><i class="fa fa-trash-o"></i></a>
</div>
<div class="clearfix"></div>
也可以是一个span内部的文字限制：
<span class="oneRow">FGSFSFSDFSAEFASDFASDFASDFS</span>
12. toggleClass互换class
今天做搜索的时候，隐藏面板加了一个收放的图标。点击隐藏/显示面板，同时修改收放的图标。
收放的图标：<i id="expondIcon" class="fa fa-angle-double-up"></i>。up是，down是
点击隐藏/显示面板，很简单，用toggle就可以了。$("#searchPanel").toggle();
点击切换收放的图标怎么操作呢？
有toggleClass的方法，但是它不是交换两个class，而是一个class有无的切换。
解决思路：这两个class一直是互斥的，在toggleClass的基础上，单独对两个class执行有无的切换。在基本的数据上(有其中一个class)，同时toggleClass这两个的时候，可以实现互换的效果。(一个有另一个无)
$("#expondIcon").toggleClass("fa-angle-double-up").toggleClass("fa-angle-double-down");