Firefox os中图像元素上的onclick事件[重复]

Question

     function listContents(storagename) {

        alert("inside function");
        //Clear up the list first
            $('#results').html("");
            var files = navigator.getDeviceStorage(storagename);

            var cursor = files.enumerate();

            cursor.onsuccess = function () {
              //alert("Got something");
              var file = this.result;
              if (file != null) {
        var imageElement = $('<img height="100" width="75">');
              imageElement.attr('src', window.URL.createObjectURL(file));
              var tagvalue=  $("<p>" + file.name + "," + file.lastModifiedDate + "," + file.type + "," + file.size  + "</p>").appendTo('#results');
              imageElement.appendTo("#results");
                this.done = false;
              }
              else {
                this.done = true;
              }

              if (!this.done) {
                this.continue();
              }
            }
}

imageElement.onclick = function() { 
console.log('onclick function!');
//alert('blah');
}

我正在从 Firefox OS 的 SDCard 中检索音频文件列表。现在我想将此文件上传到服务器，因此当我在图像元素上执行 onclick 时，我可以执行任何事件，因此我试图显示警报框，但它不起作用。

Answer 1

在您的代码片段中imageElement 在listContents 函数之外不可见，您需要通过绑定以其他方式注册onclick 处理程序。

$('#results > img').on('click', function() { 
  console.log('onclick function!');
  //alert('blah');
});

或者在 listContents 函数中注册它。

其次，如果您使用 jQuery，请坚持使用 click()、on() 方法，而不是普通的 javascript 事件（在您的示例中为 onclick）

提示：要清理元素内容，请使用空函数，如下所示：

$('#results').empty();