19/09/2018, 14:54
Sự kiện onshow
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 < ! DOCTYPE html > < html > < head > <style> div { ...
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 |
<!DOCTYPE html> <html> <head> <style> div { background: yellow; border: 1px solid #cccccc; padding: 10px; } </style> </head> <body> <div contextmenu="mymenu"> <p>Chuột phải vào trong ô này để menu xuất hiện! <menu type="context" id="mymenu" onshow="myFunction()"> <menuitem label="Tải lại trang" onclick="window.location.reload();" icon="https://webvn.com/wp-content/uploads/2014/10/ico_reload.png"></menuitem> <menu label="Chia sẻ..."> <menuitem label="Twitter" icon="https://webvn.com/wp-content/uploads/2014/10/ico_twitter.png" onclick="window.open('//twitter.com/intent/tweet?text=' + window.location.href);"></menuitem> <menuitem label="Facebook" icon="https://webvn.com/wp-content/uploads/2014/10/ico_facebook.png" onclick="window.open('//facebook.com/sharer/sharer.php?u=' + window.location.href);"></menuitem> </menu> <menuitem label="Gửi email" onclick="window.location='mailto:?body='+window.location.href;"></menuitem> </menu> </div> <p><strong>Lưu ý:</strong> <strong>Thuộc tính</strong> contextmenu chỉ hoạt động trên FireFox!</p> <script> function myFunction() { alert("Nội dung trong menu đã hiển thị"); } </script> </body> </html> |
Demo
Định nghĩa và cách sử dụng
Thuộc tính onshow được kích hoạt khi thẻ <menu> được hiển thị trong menu.
Trình duyệt hỗ trợ
Số trong bảng dưới đây thể hiện phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ cho thuộc tính.
Thuộc tính | |||||
---|---|---|---|---|---|
onshow | Không hỗ trợ | 8.0 | Không hỗ trợ | Không hỗ trợ | Không hỗ trợ |
Khác biệt giữa HTML 4.01 và HTML5
onshow là thuộc tính mới trong HTML5.
Cú pháp
1 |
<element onshow="script"> |
Giá trị thuộc tính
Giá trị | Miêu tả |
---|---|
script | Chạy script khi thuộc tính được kích hoạt |
Chi tiết
Thuộc tính được sử dụng trong thẻ : <menu>