打开新选项卡onclick table row - plugin

时间:2018-03-06 13:25:32

标签: javascript jquery jquery-plugins

我使用插件,所以当我点击表格行时,它会转到该网址。现在这工作正常,但我希望它作为一个新标签打开。我知道“window.open('urlhere','_ blank');”将网址打开到新标签但我无法弄清楚应该放在哪里。有谁知道这个插件的使用方式或经验?

我使用的插件:https://github.com/DeOldSax/clickable-tr-jquery

插件代码:

   (function ( $ ) {

var disableClickClass = 'disable-row-click';
var defaults = {};
var settings;

$.fn.clickableTable = function( options ) {
    settings = $.extend( defaults, options);

    var rows = this.find('tr[data-href], tr[data-event]');

    rows.css("cursor", "pointer");
    rows.find("td." + disableClickClass).css("cursor", "default");

    addClickEvent(rows);

    return this;
};

function addClickEvent(rows) {
    rows.click(function(e) {
        if (notClickable(e)) {
            return;
        }

        var dataEvent = $(this).data("event");
        if ( dataEvent ) {
            if (settings && settings[dataEvent]) {
               settings[dataEvent].call( this, e );
            } else {
                var fun = window[dataEvent];
                if ( typeof fun === "function" ) {
                    fun.call( this, e );
                }
            }
        }

        var dataHref = $(this).data("href");
        if ( dataHref ) {
            var isRemote = $(this).data("remote");

            var id = "uniquy-id-id";
            var aTag = buildATag(id, dataHref, isRemote);
            document.getElementById(id).click();
            aTag.remove();
        }
    });
}

function notClickable(e) {
    var target = $(e.target);
    return e.target.localName == 'a' ||
        e.target.localName == 'button' ||
        target.hasClass(disableClickClass) ||
        target.closest('td').hasClass(disableClickClass);
}

function buildATag(id, dataHref, isRemote) {
    var a = $('<a></a>');
    a.css('display', 'none');
    a.attr('data-remote', isRemote);
    a.attr('href', dataHref);
    a.attr('id', id);
    a.insertAfter($("body"));
    return a;
}

}( jQuery ));

1 个答案:

答案 0 :(得分:0)

只需使用此代码:jsFiddle

$("tr").click(function(){
    var $href = $(this).data("href");
    window.open($href,'_blank');
});

排除最后一个td元素:jsFiddle

$("tr").click(function(){
    var $href = $(this).data("href");
    window.open($href,'_blank');
});
$("tr > td:last-child").click(function(event){
    event.stopPropagation();
});