2010-06-15 38 views
6

Có cách nào tốt để tránh mã jQuery của bạn âm thầm không?Các mẫu để tránh jQuery im lặng không thành công

Ví dụ:

$('.this #is:my(complexSelector)').doSomething(); 

Tôi biết rằng mỗi khi dòng này được thực hiện, chọn được thiết kế để phù hợp với ít nhất một phần tử, hoặc số tiền nhất định của các yếu tố. Có cách nào tiêu chuẩn hay tốt để xác nhận điều đó?

Tôi nghĩ về một cái gì đó như thế này:

var $matchedElements = $('.this #is:my(complexSelector)'); 
if ($matchedElements.length < 1) 
    throw 'No matched elements'; 
$matchedElements.doSomething(); 

Ngoài ra tôi nghĩ rằng kiểm tra đơn vị sẽ là một lựa chọn hợp lệ thay vì làm rối tung mã.

Câu hỏi của tôi có thể ngớ ngẩn, nhưng tôi tự hỏi liệu có một lựa chọn nào tốt hơn so với những gì tôi hiện đang làm hay không. Ngoài ra, có thể tôi đang kiểm tra sai nếu có yếu tố nào khớp với công cụ chọn của tôi. Tuy nhiên, khi trang tiếp tục phát triển, các bộ chọn có thể ngừng kết hợp một số thành phần và phần chức năng có thể ngừng hoạt động vô tình.

Trả lời

6

Bạn có thể viết một plugin:

jQuery.fn.requireElements = function (amount, exactMatch) { 
    if (amount === undefined) { 
     amount = 1; 
    }; 

    if (this.length < amount || this.length > amount && exactMatch) { 
     throw new Error(this.length " elements instead of " (exactMatch ? "at least " : "") + amount); 
    }; 

    return this; 
}; 

Sau đó:

$('yourSelector').requireElements(2).bind('click', function() { 

}); 
6

Không nhất thiết phải sai khi bộ chọn không khớp với nội dung nào; nó phụ thuộc vào ứng dụng của bạn. Bạn có thể viết Plugin validateNonEmpty riêng bạn:

jQuery.fn.validateNonEmpty = function() { 
    if (this.length == 0) 
    throw "Empty list detected - selector: " + this.selector; 
    return this; // thanks @Matt 
}; 

Sau đó, bạn có thể làm:

$('something something').validateNonEmpty().doSomething(); 

Ngoài ra, lưu ý rằng bạn muốn kiểm tra xem chiều dài là 0, không nhỏ hơn 0.

+0

oh yea thanks @Matt !! – Pointy

2

Tôi khuyên bạn nên sử dụng jQuery lint.

ví dụ

$(function(){ 
    var foo = $('.this #is:my(complexSelector)'); 
}); 

sẽ phàn nàn cả rằng bạn có một bộ chọn không hợp lệ (như được đưa ra ví dụ chọn là trong thực tế không hợp lệ, mặc dù tôi giả sử bạn biết rằng :)), và không có các yếu tố mà trong thực tế tìm thấy .

Xem http://js.azatoth.net/test/lint.html để biết ví dụ.

+0

haha ​​Tôi chỉ muốn đưa ra một ví dụ chọn vô lý, Cảm ơn! – Matias

Các vấn đề liên quan