CODEWITHSUNDEEP
javascriptjquerygreasemonkeytampermonkey
Adrian
Adrian

Reputation: 2656

href javascript not working from a Tampermonkey script

I want to write a script which will toggle the display property of a <td> element.
I have:

// ==UserScript==
// @name       Dema VOC hide
// @version    0.1
// @include      http://mywebsite.com/*
// @require    http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js
// ==/UserScript==

 function toggle(){
        $("td[style='color:Red; height:50px']").toggle();        
} 
//Avoid conflicts
$(document).ready(function()
{      
    $('.hlavicka_vyhledavani:first-child').append("<a href='javascript:toggle()' id='toggle' class='content-link1'><b>B2B</b></a>");
    toggle();
});

.toggle() itself works, so the jQuery is loading, but after a click on B2B link I get error:

Uncaught TypeError: object is not a function

Upvotes: 2

Views: 512

Answers (1)

Jay Blanchard
Jay Blanchard

Reputation: 34416

Rewrite your code a little. Since you're using jQuery you can ditch the inline JS -

function toggle(){
        $("td[style='color:Red; height:50px']").toggle();        
} 

$(document).ready(function() {      
    $('.hlavicka_vyhledavani:first-child').append("<a href='#' id='toggle' class='content-link1'><b>B2B</b></a>");

    $('body').on('click', '#toggle', function() { // account for dynamically added elements with event delegation
        /* you may want to reconsider the name of the function
         * since there is a function you're calling with that name
         */
        toggle(); 
    });
});

In addition, if you're not re-using your function you could always call the change directly in the click function like this - 

$('body').on('click', '#toggle', function() {
    $("td[style='color:Red; height:50px']").toggle(); 
});

Upvotes: 2

Related Questions