Question

我想将所有JavaScripts保存在一个单独的文档中，我喜欢这样。现在我遇到了从最后一段代码转移到我的单独JavaScript文档的问题。

我有两个看起来像这样的事件处理程序：

<a href="http://www.commercial.se" onclick="confirmLeave()" target="_blank">

和

<IMG SRC="folder/pic_small.jpg" alt="Description"  onClick="view(this);">

这是两个事件处理程序的javascript代码：

function confirmLeave()
{
  if(confirm("Vill du lämna Blomstermåla-Bladet?")) {
    return true;
  } else {
    if(window.event) {
      window.event.returnValue = false;
    } else {
      e.preventDefault();
    }
    return false;
  }
}

并且

function view(img) {
   imgsrc = img.src.split("_")[0] + "_big.jpg";
   viewwin = window.open(imgsrc,'viewwin', "width=790,height=444,location=0");  
  viewwin.focus();  
}

我已经设法解决了我的HTML文档中没有javascript代码的问题，因为第一个onClick事件处理程序通过将我的HTML更改为：

<a href="http://www.commercial.com" id="external-link" target="_blank">

并将其添加到我的javascript文档中：

function init()
{
    var link = document.getElementById("external-link");

    link.onclick = confirmLeave;
}

window.onload = init;

我尝试过向其他的事件处理程序添加类似的解决方案，但我无法弄清楚我需要使用它来运行的代码。我想知道如何将该事件处理程序添加到init函数中。

Answer 1

如果您不想更改view函数，可以执行类似的操作，只需将图像作为参数传递给view函数即可。您可以通过将匿名函数设置为单击处理程序来完成此操作。

<IMG SRC="folder/pic_small.jpg" alt="Description" id="some-img">

function init()
{
    var img = document.getElementById("some-img");

    img.onclick = function(){
        view(this);
    };
}

Answer 2

试试这个

 <a href="http://www.commercial.com" class="external-link" target="_blank"> 
 <IMG SRC="folder/pic_small.jpg" alt="Description" id = "external-image">

    function init() {
    var link = document.getElementById("external-link");

    var links = document.getElementsByClassName("external-link");
    for (var i = 0; i < links.length; i++) {
        links[i].onclick = confirmLeave;
    }

    var image = document.getElementById("external-image");
    image.onclick = view;
}

window.onload = init;

在您的函数中使用

而不是 img

function view() {
   imgsrc = this.src.split("_")[0] + "_big.jpg";
   viewwin = window.open(imgsrc,'viewwin', "width=790,height=444,location=0");  
  viewwin.focus();  
}

事件处理程序在一个单独的文档中

2 个答案: