Làm thế nào để thêm JavaScript onClick handler vào một đối tượng html nhúng?

Question

Tôi đang cố gắng thêm trình xử lý onClick vào một đối tượng được nhúng. Trình xử lý cần thực thi một hàm nằm trong tệp .js bên ngoài được liên kết với tệp html hiện tại qua <script src="....

Tôi có cần tham chiếu chức năng khác đi do nó nằm ở nơi khác không?

Dưới đây là các mã như nó hiện đang đứng (mà không làm việc, nhưng cũng không tạo ra bất kỳ lỗi nào):

<embed src="svg/button.svg" id="buttonEmbed" width="95" height="53" 
type="image/svg+xml" onClick="buttonEvent('buttonClicked')"/> 

Answer 1

Bạn phải thực hiện onclick bên svg và liên kết nó với bên ngoài Hàm JavaScript sử dụng javascript bên trong svg. Xem SVG wiki để biết các ví dụ.

Cập nhật: Rõ ràng là SVG wiki không còn nữa. Không có gì ngạc nhiên khi các tài liệu tham khảo tốt nhất mà tôi có thể (nhanh chóng) tìm thấy là trên chính StackOverflow.

This answer describes how to implement onclick inside the svg.

Answer 2

Sử dụng liên kết javascript (Mario Menger đã trả lời rằng đã có).

Nếu bạn không thể hoặc sẽ không sử dụng ràng buộc, bạn có thể sử dụng những gì xil3 đã trả lời với một sửa đổi:

Sử dụng một sản phẩm nào neo thẻ <a href="javascript:someFunc()"></a> như người tiêu dùng nhấp chuột. Đặt z-index và vị trí/kích thước của nó để nó được định vị trên đối tượng svg (cho khả năng tương thích giữa các trình duyệt).

Answer 3

Tất cả các nhấp chuột phải là chữ thường.

<embed src="svg/button.svg" id="buttonEmbed" width="95" height="53" 
type="image/svg+xml" onclick="alert('hello!');"/>