Không thể chọn con của phần tử HTML5 trong IE8 với bộ chọn jQuery

Tôi đã tìm thấy một số bài đăng có vấn đề tương tự, nhưng đây là một vấn đề khác. Tôi đã nâng cấp từ jQuery 1.4 lên 1.4.2 sau khi tôi đọc một bài đăng khác, nhưng vấn đề vẫn xuất hiện. Tôi cũng đã thử chạy IE 8 ở chế độ tương thích và không có gì có vẻ hoạt động. Tất nhiên, nó hoạt động hoàn hảo trong Chrome.Không thể chọn con của phần tử HTML5 trong IE8 với bộ chọn jQuery

Dưới đây là đánh dấu:

<section class="pleaseWaitButton"> 
    <p><img src="images/please_wait.png" alt="Please wait" /></p> 
    <p><input type="image" src="images/add_to_cart.png" alt="Add to cart"/></p> 
</section>

Đây là jQuery selector duy nhất mà không làm việc trong kịch bản này ...

$('.pleaseWaitButton').length // 1

Và đây là bộ chọn jQuery rằng sẽ không hoạt động!

$('.pleaseWaitButton').find('input').length // 0 
$('.pleaseWaitButton input').length // 0 
$('.pleaseWaitButton > p > input').length // 0

Bất kỳ ý tưởng nào? Bất kỳ ai...?

Nguồn

2010-07-28 jedmao

Internet Explorer 8 có hỗ trợ kỳ quặc đối với đồng bằng HTML 5, IE6 và IE7 chỉ không hỗ trợ.

Bạn cần phải shiv các yếu tố HTML 5 để tạo kiểu và sử dụng đúng phương pháp/thuộc tính như innerHTML, getElementsByTagName trên chúng.

này sẽ làm việc trong IE6-IE8:

<!doctype html> 
<html> 
<!--[if lt IE 9]> 
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> 
<![endif]--> 
<section class="pleaseWaitButton"> 
    <p><img src="images/please_wait.png" alt="Please wait" /></p> 
     <p><input type="image" src="images/add_to_cart.png" alt="Add to cart"/></p> 
</section> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script> 
<script> 
    alert($('.pleaseWaitButton').find('input').length) 
    alert($('.pleaseWaitButton input').length) 
    alert($('.pleaseWaitButton > p > input').length) 
</script> 
</html>

Live Demo: http://medero.org/html5.html

Nguồn

2010-07-28 11:57:44

Lưu ý rằng shiv không giải quyết mọi vấn đề với các thành phần mới; đặc biệt 'innerHTML' cần được chăm sóc đặc biệt. Tôi sẽ không sử dụng các phần tử chứa ngữ nghĩa HTML5: chúng sẽ chỉ cung cấp cho bạn các lỗi IE và chưa có nhiều lợi ích hữu hình trên một div. – bobince

Tôi sẽ nói rằng các yếu tố HTML5 đã làm cho css của tôi cực kỳ sạch sẽ so với những gì tôi đã viết trước đây. Ví dụ: mỗi lần tôi có kiểu cho mục chính trên một trang, nó luôn là phần tử bài viết của tôi, vì vậy css là siêu sạch vì tôi chỉ cần tạo kiểu cho phần tử bài viết. Đó chỉ là một ví dụ. Không cần id trong hầu hết các trường hợp. – jedmao

Cảm ơn câu trả lời. Nó hoạt động tốt cho đến nay. Tôi không bao giờ sử dụng innterHTML vì vậy đó sẽ không phải là một vấn đề. – jedmao

<section> là một yếu tố HTML5 không được hỗ trợ trong IE8, bạn sẽ có những vấn đề sử dụng nó như một phần tử, bao gồm việc tìm kiếm trẻ em bên dưới nó. Nó không phải là một vấn đề jQuery, đó là một vấn đề DOM cơ bản, here's a demonstration:

Tất cả tôi đang làm là cho nguyên tố này một ID để đơn giản hóa mọi thứ:

<section class="pleaseWaitButton" id="btn">

Sau đó thử và nhận được đó là trẻ em:

document.getElementById('btn').children.length

Điều này giúp bạn trở thành một trong 2 trình duyệt HTML5, 0 trong IE.

Nguồn

2010-07-28 11:59:59

Bạn có thể tạo phần tử theo cách thủ công để IE hỗ trợ tạo kiểu và DOM thao tác đúng cách. Ngoài ra còn có một sửa chữa của Jonathan Neal cho in HTML 5 yếu tố, kể từ khi IE không hỗ trợ cho các yếu tố HTML 5 nguyên bản. –

@meder - Đúng vậy, câu trả lời của tôi là * tại sao * không hoạt động và mã html5shiv có [các vấn đề khác] (http://code.google.com/p/html5shiv/issues/list) vì vậy nó không phải là sửa chữa nhanh chóng. Như một lưu ý phụ, ví dụ của bạn, khi làm một trang mẫu, hãy đảm bảo có HTML hợp lệ hoặc nó không phải là một thử nghiệm hợp lệ :) –

Điều gì không hợp lệ? – jedmao

Không thể chọn con của phần tử HTML5 trong IE8 với bộ chọn jQuery

Trả lời

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