Home > Web Front-end > JS Tutorial > Summary of jquery simple application examples_jquery

Summary of jquery simple application examples_jquery

WBOY
Release: 2016-05-16 17:25:53
Original
1215 people have browsed it

1. Specify the subpage content to be displayed in a div on the main page, where renderContainer can be the id or name of the main page div

Copy code The code is as follows:

$.ajax({
url: url,
data: parameters,
type: "GET",
dataType: "html ",
success:function (html) {
$(renderContainer).attr("title", title);
$(renderContainer).html(html);
$(renderContainer). dialog({
autoOpen: true,
width: 590,
height: 720,
modal: true,
resizable: false,
draggable: true
});
}
});

2. Select the specified ID of the specified attribute of the specified table to perform a certain action
Copy Code The code is as follows:

$(".tbl_checked tr[userid='" idArray[i] "']").remove();

3. Delay loading trigger event, select the checked checkbox whose id contains the "userid" field, and put their id in the idArray array
Copy code The code is as follows:

$("#authorize_reset").live('click',function(){
var idArray = [];
$(":checkbox[id^='userid']").each(function(){
if($(this).attr("checked") == "checked") {
idArray.push(parseInt($(this).val()));
}
});
});
});

3. Another way to select the checkbox whose id contains the "userid" field and is checked
Copy code Code As follows:

$(":checkbox[id^='userid'][checked]").each(function(){
selectedRoleIdArray.push(parseInt($(this). val()));
});

4. Simple and practical click to change the style
Copy code The code is as follows:

$(function(){
$(".tbl_checked tr").live('click', function(){
var target = $(this);
if(target.attr("class") == "tr_checked") {
target.removeClass("tr_checked");
} else {
target.addClass ("tr_checked");
}
})

5. The time comparison in "2012-12-21" format needs to be converted first
Copy code The code is as follows:

var compareTime = Date.parse(setTime.replace(/-/g, "/") ; > The code is as follows:

(function ($) {
var FormatDateTime = function FormatDateTime() { };
$.FormatDateTime = function (days) { //var correcttime1 = eval('( new ' obj.replace(new RegExp("/", "gm"), "") ')'); var myDate = new Date(); myDate.setDate( myDate.getDate() days); var year = myDate.getFullYear(); var month = ("0" (myDate.getMonth() 1)).slice(-2); var day = ("0" myDate.getDate()).slice(-2);
var s=year "-" month "-" day;
return s ;
}
}) (jQuery);


The last is a similar two-way list made with jquery, which can exchange content left and right




Copy code


The code is as follows:

$(function(){
//Click to load user list, role user list
$(".add_remove_user").live('click',function() {
var rid = $(".current").attr("id").substring("ut_".length);
changeroleDialog(changeroleRoute.url(), {id: rid}, ".set_user_list");
});

$(".tbl_checked tr").live('click', function(){
var target = $ (this);
if(target.attr("class") == "tr_checked") {
target.removeClass("tr_checked");
} else {
target.addClass(" tr_checked");
}
});
$(".tb1_role_checked tr").live('click', function(){
var target = $(this);
if(target.attr("class") == "tr_checked_1") {
target.removeClass("tr_checked_1");
} else {
target.addClass("tr_checked_1");
}
});


$("#addThisRole").live('click',function(){
if($(".tb1_role_checked tr").first().attr("default_value")=='noResult'){
var table = $(".tb1_role_checked");
$(".tb1_role_checked tr").remove();
var tr = $("")
.append($("").html('Name'))
.append($("").html ('account'))
table.append(tr);
}
$(".tr_checked").each(function(){
$(this).remove();
var element = $(this);
var id = element.attr("param_id")
var name = element.attr("param_name")
var account = element.attr("param_account ")
var table = $(".tb1_role_checked");
var tr = $("")
.append($("").html(element.attr("param_name")))
.append($("").html(element.attr("param_account")))
//table.append(tr);
tr.insertAfter( $(".tb1_role_checked tr").first());
});

});
$("#deleteThisRole").live('click',function(){
if($(".tbl_checked tr").first().attr("default_value")=='noResult'){
var table = $(".tbl_checked");
$( ".tbl_checked tr").remove();
var tr = $("")
.append($(" ").html('Name'))
.append($("").html('Account'))
table.append(tr);
}
$(".tr_checked_1").each(function(){
$(this).remove();
var element = $(this);
var id = element. attr("param_roleid");
var name = element.attr("param_rolename");
var account = element.attr("param_roleaccount");
var table = $(".tbl_checked") ;
var tr = $("")
.append($("").html(element.attr("param_rolename")))
.append($("//table.insertBefore(tr, $(".tbl_checked tr").first());
tr.insertAfter($( ".tbl_checked tr").first());
});
});
});

Summary of jquery simple application examples_jquery
That’s all for now , the above code is not perfect yet, and I hope you will give me your advice on areas that need improvement.
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template