Jquery 확장 메서드_jquery

인터넷에서 정보를 검색한 후 JQUERY 확장 메소드를 작성하는 방법에는 jquery.fn.extend를 사용하는 방법과 jquery.extend를 사용하는 방법이 있습니다.
jquery.fn은 jquery.prototype을 의미합니다. jquery 객체에 메소드를 추가합니다. 우연히 확장방법을 사용하다가 jquery.fn을 사용하게 되었는데 여기서는 jquery.fn의 사용법을 적어보겠습니다. 인터넷에 많이 있는데 쓰기가 매우 어렵습니다
예를 들어 버튼을 누르면 클릭하면 텍스트 상자 값과 매개변수 값이 나타납니다.

코드 복사 코드는 다음과 같습니다.

jquery.fn.extend({
alertMessage:function(message ){
var txtboxValue = $(this).val();//$(this)를 사용하여 확장 메서드가 어떤 개체인지 나타냅니다. 여기에 추가된 내용은 $('#textbox')
alert(txtboxValue message )
}
})
$(function(){
$("input[ name='btn' ]").click(function(){
$(' #textbox' ).alertMessage("문자열입니다");
})
})

html:

코드 복사 코드는 다음과 같습니다.

< 입력 유형='버튼' 이름='btn' 값='경고'/>
<입력 유형='텍스트' id='텍스트 상자' 값='abc'/> 🎜>
그래서 재작년에 나온 제이쿼리 중국어 문서를 파헤쳐봤습니다. Jquery의 메소드에 대해 간략하게 살펴보았습니다. Jquery가 매우 강력하다는 것을 알았는데 왜 이전에는 발견하지 못했습니까? 그래서 제가 직접 Jquery를 기반으로 확장 함수를 작성해봤습니다.

코드를 복사하세요 코드는 다음과 같습니다. jQuery.fn.__toggleCheck = function (idPrefix) {

var c = false

$(this).click(function () {
if (c) c = false;
else c = true;
$("input[type=checkbox][id^=" idPrefix "]").each(
function () {
this.checked = c;
}
);
});
jQuery.fn.__setRepeaterStyle = function(itemTag, evenStyle, hoverStyle) {
$("#" this. attr("id") " " itemTag ":odd").addClass(evenStyle);
var cssOriginal = ""
$("#" this.attr("id") " " itemTag "" ).mouseover(function () {
cssOriginal = $(this).attr("class");
$(this).addClass(hoverStyle);
})
$(" #" this.attr(" id") " " itemTag "").mouseout(function () {
$(this).removeClass();
if (cssOriginal.length > 0) {
$(this).addClass (cssOriginal);
}
});


위 함수는 다음과 같이 호출됩니다. 🎜>

코드 복사

코드는 다음과 같습니다.

type="checkbox" id="a_1" /> 1 2 3 4 5 6

모두

;확인

1

🎜>