Chrome扩展程序/ jQuery可在一个站点上运行,但不能在其他站点上运行吗?尝试在点击链接时触发事件

hir

我对于三个不同的站点有三个不同的js文件。首先,我要说一下,清单文件确实具有正确的设置,可以将这些文件放在适当的位置,并且扩展名中只有一项功能(最重要的一项)不起作用。

第一个有效,适用于此类页面:http : //hearthstonetopdeck.com/deck.php?d=1613

var decklist = [];
$('.cardname').each(function(i, el) {
    var values = $(this).text().split(' ');
    var count = parseInt(values.shift(), 10);
    for (var i = 0; i < count; i++) {
        decklist.push(values.join(' '));
    }
});
var data = decklist.join("\r\n");
var saveData = (function () {
    var a = document.createElement("a");
    document.body.appendChild(a);
    a.style = "display: none";
    return function (data, fileName) {
        var blob = new Blob([data], {type: "octet/stream"}),
            url = window.URL.createObjectURL(blob);
        a.href = url;
        a.download = fileName;
        a.click();
        window.URL.revokeObjectURL(url);
    };
}());

$(document).ready(function(){
var html = $('#deckname').html() + '';
fileName = $('#deckname').text() + '.txt';
html = html.replace(/<h1>#/, '<h1><a class="download" href="#download">DOWNLOAD</a> - #');
$('#deckname').html(html);
});

$(document).ready(function(){
   $('a[href="#download"]').click(function(){
      saveData(data, fileName);
   }); 
});

在控制台中运行此程序将与扩展程序一样运行。我已经使用chrome扩展名方法和粘贴在控制台中测试了所有这3个js文件。结果是相同的。

第二个网站(http://www.hearthhead.com/deck=300/spell-power-on-a-budget)不再起作用。我似乎也不记得更改任何代码,它应该以相同的方式触发。这里的问题是,尽管出现下载链接,但事件不会触发或根本无法正常工作。这是站点2的代码:

var decklist = [];
$('.deckguide-cards-type li').each(function(i, el) {
    var values = $(this).text().substring(1).split(' ');
        if ($.inArray("x2", values) != "-1") {
        values.pop();
        decklist.push(values.join(' '));
    }
    decklist.push(values.join(' '));
});

var data = decklist.join("\r\n");
var saveData = (function () {
    var a = document.createElement("a");
    document.body.appendChild(a);
    a.style = "display: none";
    return function (data, fileName) {
        var blob = new Blob([data], {type: "octet/stream"}),
            url = window.URL.createObjectURL(blob);
        a.href = url;
        a.download = fileName;
        a.click();
        window.URL.revokeObjectURL(url);
    };
}());


$(document).ready(function(){
   $('a[href="#download"]').click(function(){
      saveData(data, fileName);
   }); 
});

$(document).ready(function(){
var html = $('.text h1').html() + ' hearthstonedeckdl';
fileName = $('.text h1').text() + '.txt';
html = html.replace(/hearthstonedeckdl/, '- <a class="download" href="#download">DOWNLOAD</a>');
$('.text h1').html(html);
});

加载时触发功能saveData确实可以按预期工作,并且下载了包含适当数据的.txt文件。这是单击下载链接时想要的功能,并且在第一个示例中有效。

最后一个示例没有工作期,但是像以前一样,在负载上触发也可以正常工作。这只是我遇到问题的链接。该站点位于:http : //www.hearthpwn.com/decks/46364-d3managements-legend-hunter

代码如下:

var decklist = [];
$('.col-name').each(function(i, el) { 
    var values = $(this).text().substring(2).substring(0, $(this).text().length - 10).replace(/[^a-zA-Z0-9\.\s']+/g ,"").split(' ');
    if ($.inArray("", values) != "-1") {
    return;
    } else if ($(this).text().substr($(this).text().length - 3, 1) == "2") {
    decklist.push(values.join(' '));
    decklist.push(values.join(' '));
    } else {
    decklist.push(values.join(' '));
    }
});


var data = decklist.join("\r\n");
var saveData = (function () {
    var a = document.createElement("a");
    document.body.appendChild(a);
    a.style = "display: none";
    return function (data, fileName) {
        var blob = new Blob([data], {type: "octet/stream"}),
            url = window.URL.createObjectURL(blob);
        a.href = url;
        a.download = fileName;
        a.click();
        window.URL.revokeObjectURL(url);
    };
}());


$(document).ready(function(){
   $('a[href="#download"]').click(function(){
      saveData(data, fileName);
   }); 
});

$(document).ready(function(){
var html = $('.t-deck-title').html() + ' hearthstonedeckdl';
fileName = $('.t-deck-title').text() + '.txt';
html = html.replace(/hearthstonedeckdl/, '</br><a class="download" href="#download">DOWNLOAD</a>');
$('.t-deck-title').html(html);
});

我对jQuery相当陌生,但是与我的一个比我有更多经验的朋友进行咨询似乎找不到这个问题,这使我非常生气。

谢谢!

您在锚点上声明一个click事件,然后再创建它。

替换为:

$(document).ready(function(){
   $('a[href="#download"]').click(function(){
      saveData(data, fileName);
   }); 
});

有了这个:

$(document).ready(function(){
   $(document).on('click', 'a[href="#download"]', function(){
      saveData(data, fileName);
   }); 
});

或者保留您的代码,并确保您调用此代码:

var html = $('.t-deck-title').html() + ' hearthstonedeckdl';
fileName = $('.t-deck-title').text() + '.txt';
html = html.replace(/hearthstonedeckdl/, '</br><a class="download" href="#download">DOWNLOAD</a>');
$('.t-deck-title').html(html);

在附加点击事件之前。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

Related 相关文章

热门标签

归档