Hướng dẫn get element called function javascript - lấy phần tử được gọi là hàm javascript

Làm thế nào tôi có thể nhận ID của một yếu tố được gọi là hàm JS?

body.jpg là hình ảnh của một con chó khi người dùng chỉ chuột của mình quanh màn hình ở các bộ phận khác nhau của cơ thể, một hình ảnh mở rộng được hiển thị. ID của phần tử khu vực giống hệt với tên tệp hình ảnh trừ đi thư mục và phần mở rộng.

Hướng dẫn get element called function javascript - lấy phần tử được gọi là hàm javascript
Hướng dẫn get element called function javascript - lấy phần tử được gọi là hàm javascript

Đã hỏi ngày 2 tháng 10 năm 2011 lúc 15:11Oct 2, 2011 at 15:11

0

Chuyển tham chiếu đến phần tử vào hàm khi nó được gọi là:




Đã trả lời ngày 2 tháng 10 năm 2011 lúc 15:14Oct 2, 2011 at 15:14

James Sumnersjames SumnersJames Sumners

14.2K10 Huy hiệu vàng58 Huy hiệu bạc75 Huy hiệu đồng10 gold badges58 silver badges75 bronze badges

3

Tôi ngạc nhiên khi không ai đề cập đến việc sử dụng




7 trong trình xử lý sự kiện. Nó hoạt động tự động trong các trình duyệt hiện đại và có thể được thực hiện để hoạt động trong các trình duyệt khác. Nếu bạn sử dụng



8 hoặc



9 để cài đặt trình xử lý sự kiện của mình, thì bạn có thể tạo giá trị



7 tự động được gán cho đối tượng được tạo sự kiện.

Hơn nữa, người dùng trình xử lý sự kiện được cài đặt lập trình cho phép bạn tách mã JavaScript khỏi HTML thường được coi là một điều tốt.

Đây là cách bạn sẽ làm điều đó trong mã của mình bằng JavaScript đơn giản:

Xóa

// simplified utility function to register an event handler cross-browser
function setEventHandler(obj, name, fn) {
    if (typeof obj == "string") {
        obj = document.getElementById(obj);
    }
    if (obj.addEventListener) {
        return(obj.addEventListener(name, fn));
    } else if (obj.attachEvent) {
        return(obj.attachEvent("on" + name, function() {return(fn.call(obj));}));
    }
}

function zoom() {
    // you can use "this" here to refer to the object that caused the event
    // this here will refer to the calling object (which in this case is the )
    console.log(this.id);
    document.getElementById("preview").src="http://photos.smugmug.com/photos/344290962_h6JjS-Ti.jpg";
}

// register your event handler
setEventHandler("nose", "mouseover", zoom);
1 khỏi HTML của bạn và cài đặt trình xử lý sự kiện trong JavaScript của bạn như thế này:

// simplified utility function to register an event handler cross-browser
function setEventHandler(obj, name, fn) {
    if (typeof obj == "string") {
        obj = document.getElementById(obj);
    }
    if (obj.addEventListener) {
        return(obj.addEventListener(name, fn));
    } else if (obj.attachEvent) {
        return(obj.attachEvent("on" + name, function() {return(fn.call(obj));}));
    }
}

function zoom() {
    // you can use "this" here to refer to the object that caused the event
    // this here will refer to the calling object (which in this case is the )
    console.log(this.id);
    document.getElementById("preview").src="http://photos.smugmug.com/photos/344290962_h6JjS-Ti.jpg";
}

// register your event handler
setEventHandler("nose", "mouseover", zoom);

Đã trả lời ngày 2 tháng 10 năm 2011 lúc 16:41Oct 2, 2011 at 16:41

Hướng dẫn get element called function javascript - lấy phần tử được gọi là hàm javascript

jfriend00jfriend00jfriend00

657K91 Huy hiệu vàng933 Huy hiệu bạc934 Huy hiệu Đồng91 gold badges933 silver badges934 bronze badges

1

Bạn có thể sử dụng 'cái này' trong xử lý sự kiện:

document.getElementById("preview").onmouseover = function() {
    alert(this.id);
}

Hoặc truyền đối tượng sự kiện cho người xử lý như sau:

document.getElementById("preview").onmouseover = function(evt) {
    alert(evt.target.id);
}

Bạn nên sử dụng đính kèm (cho IE <9)/AddEventListener (IE9 và các trình duyệt khác) để đính kèm các sự kiện. Ví dụ trên là cho sự ngắn gọn.

function myHandler(evt) {
    alert(evt.target.id);
}

var el = document.getElementById("preview");
if (el.addEventListener){
    el.addEventListener('click', myHandler, false); 
} else if (el.attachEvent){
    el.attachEvent('onclick', myHandler);
}

Đã trả lời ngày 2 tháng 10 năm 2011 lúc 18:46Oct 2, 2011 at 18:46

Mixelmixelmixel

24.4K12 Huy hiệu vàng122 Huy hiệu bạc163 Huy hiệu đồng12 gold badges122 silver badges163 bronze badges

Bạn có thể mã hóa thiết lập xử lý như thế này:


Sau đó,




7 trong bộ xử lý của bạn sẽ đề cập đến phần tử. Bây giờ, tôi sẽ đưa ra lời cảnh báo rằng tôi không chắc chắn 100% điều gì xảy ra khi bạn có một người xử lý trong thẻ
// simplified utility function to register an event handler cross-browser
function setEventHandler(obj, name, fn) {
    if (typeof obj == "string") {
        obj = document.getElementById(obj);
    }
    if (obj.addEventListener) {
        return(obj.addEventListener(name, fn));
    } else if (obj.attachEvent) {
        return(obj.attachEvent("on" + name, function() {return(fn.call(obj));}));
    }
}

function zoom() {
    // you can use "this" here to refer to the object that caused the event
    // this here will refer to the calling object (which in this case is the )
    console.log(this.id);
    document.getElementById("preview").src="http://photos.smugmug.com/photos/344290962_h6JjS-Ti.jpg";
}

// register your event handler
setEventHandler("nose", "mouseover", zoom);
3, phần lớn là vì tôi chưa thấy thẻ
// simplified utility function to register an event handler cross-browser
function setEventHandler(obj, name, fn) {
    if (typeof obj == "string") {
        obj = document.getElementById(obj);
    }
    if (obj.addEventListener) {
        return(obj.addEventListener(name, fn));
    } else if (obj.attachEvent) {
        return(obj.attachEvent("on" + name, function() {return(fn.call(obj));}));
    }
}

function zoom() {
    // you can use "this" here to refer to the object that caused the event
    // this here will refer to the calling object (which in this case is the )
    console.log(this.id);
    document.getElementById("preview").src="http://photos.smugmug.com/photos/344290962_h6JjS-Ti.jpg";
}

// register your event handler
setEventHandler("nose", "mouseover", zoom);
3 trong một thập kỷ hoặc lâu hơn. Tôi nghĩ rằng nó sẽ cung cấp cho bạn thẻ hình ảnh, nhưng điều đó có thể sai.

Chỉnh sửa - Có, nó sai - bạn nhận được thẻ

// simplified utility function to register an event handler cross-browser
function setEventHandler(obj, name, fn) {
    if (typeof obj == "string") {
        obj = document.getElementById(obj);
    }
    if (obj.addEventListener) {
        return(obj.addEventListener(name, fn));
    } else if (obj.attachEvent) {
        return(obj.attachEvent("on" + name, function() {return(fn.call(obj));}));
    }
}

function zoom() {
    // you can use "this" here to refer to the object that caused the event
    // this here will refer to the calling object (which in this case is the )
    console.log(this.id);
    document.getElementById("preview").src="http://photos.smugmug.com/photos/344290962_h6JjS-Ti.jpg";
}

// register your event handler
setEventHandler("nose", "mouseover", zoom);
3 chứ không phải
// simplified utility function to register an event handler cross-browser
function setEventHandler(obj, name, fn) {
    if (typeof obj == "string") {
        obj = document.getElementById(obj);
    }
    if (obj.addEventListener) {
        return(obj.addEventListener(name, fn));
    } else if (obj.attachEvent) {
        return(obj.attachEvent("on" + name, function() {return(fn.call(obj));}));
    }
}

function zoom() {
    // you can use "this" here to refer to the object that caused the event
    // this here will refer to the calling object (which in this case is the )
    console.log(this.id);
    document.getElementById("preview").src="http://photos.smugmug.com/photos/344290962_h6JjS-Ti.jpg";
}

// register your event handler
setEventHandler("nose", "mouseover", zoom);
6. Vì vậy, bạn sẽ phải có được cha mẹ của phần tử đó (bản đồ), và sau đó tìm hình ảnh đang sử dụng nó (nghĩa là
// simplified utility function to register an event handler cross-browser
function setEventHandler(obj, name, fn) {
    if (typeof obj == "string") {
        obj = document.getElementById(obj);
    }
    if (obj.addEventListener) {
        return(obj.addEventListener(name, fn));
    } else if (obj.attachEvent) {
        return(obj.attachEvent("on" + name, function() {return(fn.call(obj));}));
    }
}

function zoom() {
    // you can use "this" here to refer to the object that caused the event
    // this here will refer to the calling object (which in this case is the )
    console.log(this.id);
    document.getElementById("preview").src="http://photos.smugmug.com/photos/344290962_h6JjS-Ti.jpg";
}

// register your event handler
setEventHandler("nose", "mouseover", zoom);
6 có thuộc tính "Usemap" đề cập đến tên của bản đồ).

Chỉnh sửa lại - ngoại trừ nó không quan trọng vì bạn muốn Durr "ID" của khu vực. Xin lỗi vì đã không đọc chính xác.want the area's "id" durr. Sorry for not reading correctly.

Đã trả lời ngày 2 tháng 10 năm 2011 lúc 15:16Oct 2, 2011 at 15:16

POINTYPOODTYPointy

395K59 Huy hiệu vàng575 Huy hiệu bạc607 Huy hiệu Đồng59 gold badges575 silver badges607 bronze badges

Tôi biết bạn không muốn một giải pháp jQuery nhưng bao gồm cả JavaScript bên trong HTML là không lớn.

Ý tôi là bạn có thể làm điều đó nhưng có rất nhiều lý do tại sao bạn không nên (đọc trên JavaScript không phô trương nếu bạn muốn chi tiết).

Vì vậy, vì lợi ích của những người khác có thể thấy câu hỏi này, đây là giải pháp jQuery:

$(document).ready(function() {
  $('area').mouseover(function(event) {
    $('#preview').attr('src', 'images/' + $(event.srcElement).attr('id'));
  });
});

Lợi ích chính là bạn không kết hợp mã JavaScript với HTML. Hơn nữa, bạn chỉ cần viết điều này một lần và nó sẽ hoạt động cho tất cả các thẻ trái ngược với việc phải chỉ định trình xử lý cho mỗi người một cách riêng biệt.

Lợi ích bổ sung là mọi trình xử lý jQuery đều nhận được một đối tượng sự kiện chứa nhiều dữ liệu hữu ích - chẳng hạn như nguồn của sự kiện, loại sự kiện và vì vậy, giúp việc viết loại mã bạn theo đuổi dễ dàng hơn nhiều.

Cuối cùng, vì đó là jquery, bạn không cần phải nghĩ về các công cụ trình duyệt chéo - một lợi ích chính đặc biệt là khi giao dịch với các sự kiện.

Đã trả lời ngày 2 tháng 10 năm 2011 lúc 15:46Oct 2, 2011 at 15:46

Gregory MostizkyGregory MostizkyGregory Mostizky

7.1611 Huy hiệu vàng25 Huy hiệu bạc29 Huy hiệu đồng1 gold badge25 silver badges29 bronze badges

0

Tôi cũng muốn điều này xảy ra, vì vậy chỉ cần chuyển ID của phần tử trong hàm được gọi là và được sử dụng trong tệp JS của tôi:

function copy(i,n)
{
 var range = document.createRange();
range.selectNode(document.getElementById(i));
window.getSelection().removeAllRanges();
window.getSelection().addRange(range); 
document.execCommand('copy');
window.getSelection().removeAllRanges();
document.getElementById(n).value = "Copied";
}

Đã trả lời ngày 9 tháng 6 năm 2019 lúc 8:48Jun 9, 2019 at 8:48

Đối với những người khác bất ngờ nhận được phần tử cửa sổ, một cạm bẫy phổ biến:

click here

mà thực sự phạm vi




7 đến đối tượng cửa sổ. Thay vì:




0

vượt qua đối tượng

// simplified utility function to register an event handler cross-browser
function setEventHandler(obj, name, fn) {
    if (typeof obj == "string") {
        obj = document.getElementById(obj);
    }
    if (obj.addEventListener) {
        return(obj.addEventListener(name, fn));
    } else if (obj.attachEvent) {
        return(obj.attachEvent("on" + name, function() {return(fn.call(obj));}));
    }
}

function zoom() {
    // you can use "this" here to refer to the object that caused the event
    // this here will refer to the calling object (which in this case is the )
    console.log(this.id);
    document.getElementById("preview").src="http://photos.smugmug.com/photos/344290962_h6JjS-Ti.jpg";
}

// register your event handler
setEventHandler("nose", "mouseover", zoom);
9 như mong đợi. (nop () chỉ là bất kỳ hàm trống nào.)

Đã trả lời ngày 30 tháng 4 năm 2020 lúc 17:29Apr 30, 2020 at 17:29

Roger rogerRoger

7438 Huy hiệu bạc11 Huy hiệu đồng8 silver badges11 bronze badges

Nếu bạn thiết lập một người nghe như thế này:




1

Sau đó, bạn có thể nhận được ID như thế này:




2

Đã trả lời ngày 8 tháng 10 năm 2021 lúc 12:13Oct 8, 2021 at 12:13

KZTDKZTDkztd

2.78119 Huy hiệu bạc17 Huy hiệu đồng19 silver badges17 bronze badges

Cách đầu tiên: Gửi phần tử kích hoạt bằng 7




3

Bằng cách này, gửi một đối tượng thuộc loại:

document.getElementById("preview").onmouseover = function() {
    alert(this.id);
}
1 và bạn tự nhận được phần tử. Bạn không cần quan tâm nếu phần tử có ID hoặc bất kỳ thuộc tính nào khác. Và nó tự hoạt động tốt.


Cách thứ hai: Gửi ID phần tử kích hoạt bằng document.getElementById("preview").onmouseover = function() { alert(this.id); } 2




4

Bằng cách này, gửi một đối tượng thuộc loại:

document.getElementById("preview").onmouseover = function() {
    alert(this.id);
}
3 và bạn không nhận được phần tử. Vì vậy, trước khi sử dụng, bạn cần đảm bảo rằng phần tử của bạn đã có ID.

Bạn không được gửi ID phần tử một mình như

document.getElementById("preview").onmouseover = function() {
    alert(this.id);
}
4. Nó không phải là mã sạch và nó làm cho mã của bạn mất chức năng.

Đã trả lời ngày 5 tháng 7 lúc 7:24Jul 5 at 7:24

Hướng dẫn get element called function javascript - lấy phần tử được gọi là hàm javascript

Giả sử, bạn có một nút như thế này:




5

Trong chức năng, bạn có thể tiếp cận ID theo cách này:




6

Đã trả lời ngày 20 tháng 9 lúc 17:34Sep 20 at 17:34

Bafsarbafsarbafsar

1.0222 Huy hiệu vàng15 Huy hiệu bạc15 Huy hiệu đồng2 gold badges15 silver badges15 bronze badges

Hàm () () trong javascript là gì?

Một hàm trong JavaScript tương tự như một thủ tục, một tập hợp các câu lệnh thực hiện một tác vụ hoặc tính toán một giá trị, nhưng đối với một quy trình để đủ điều kiện làm chức năng, nó sẽ lấy một số đầu vào và trả về một đầu ra trong đó có một số mối quan hệ rõ ràng giữa đầu vào và đầu ra.a set of statements that performs a task or calculates a value, but for a procedure to qualify as a function, it should take some input and return an output where there is some obvious relationship between the input and the output.

Giá trị tài liệu getEuityById () là gì?

Phương thức getEuityById () trả về một phần tử có giá trị được chỉ định. Phương thức getEuityById () trả về null nếu phần tử không tồn tại. Phương thức getEuityById () là một trong những phương pháp phổ biến nhất trong HTML DOM. Nó được sử dụng gần như mỗi khi bạn muốn đọc hoặc chỉnh sửa phần tử HTML.returns an element with a specified value. The getElementById() method returns null if the element does not exist. The getElementById() method is one of the most common methods in the HTML DOM. It is used almost every time you want to read or edit an HTML element.

Tại sao giá trị getEuityByid không hoạt động?

Lý do đằng sau tài liệu.JavaScript Document.getEuityByID không phải là một giải pháp chức năng.Phương thức GetEuityByID của JavaScript chọn một phần tử từ mô hình đối tượng tài liệu HTML (DOM).Nếu bạn đánh vần không chính xác phương pháp này, bạn sẽ gặp tài liệu.document. getElementByID is not a function Solution. The JavaScript getElementById method selects an element from the HTML Document Object Model (DOM). If you incorrectly spell this method, you'll encounter the document.

Làm thế nào để bạn gọi một hàm trong một hàm trong JavaScript?

Approach:..
Viết một chức năng bên trong một hàm khác ..
Thực hiện cuộc gọi đến hàm bên trong trong câu lệnh trả về của hàm bên ngoài ..
Gọi nó là niềm vui (a) (b) trong đó A là tham số ở bên ngoài và B là hàm bên trong ..
Cuối cùng trả về đầu ra kết hợp từ chức năng lồng nhau ..