jQuery - How to call a function in another scope

Question

I'm using this: http://terminal.jcubic.pl/

I want to output something, and have that output be a hyperlink that when clicked would output something else.

    jQuery(document).ready(function($) {
        $('#terminal').terminal(function(cmd, term) {
             term.echo('\nClick this: <a onClick="javascript:terminal.exec(\'somethingelse\')">somethingelse</a>', {raw: true});
        }, {
            greetings: "Welcome!\n",

            onInit: function(terminal) {
                terminal.echo('Welcome!');
            },
            prompt: '> '
        });
    });

However,

<a onClick="javascript:terminal.exec

doesn't work because terminal.exec isn't defined in the context of the window. What would be the proper way to do it?

Thanks!

Handle the onclick in JavaScript and not inline HTML, and define it where the function is defined in your code. — Spencer Wieczorek
– Spencer Wieczorek, Commented May 24, 2015 at 4:05
It's all within that function: $('#terminal').terminal(function(cmd, term) { so how would that work? — ieatpizza
– ieatpizza, Commented May 24, 2015 at 4:12

fny · Accepted Answer · 2015-05-24 04:32:34Z

3

You can define the onclick handler in your JavaScript:

<!-- In your HTML -->
<a class="trigger-terminal" href="#">Terminal</a>

// In your JavaScript in the scope of terminal
$('.trigger-terminal').click(function() { terminal.exec(); });

Or you could sin and expose your terminal variable by attaching it to the global window object:

window.terminal = terminal;

Here are the two suggestions inline with your code:

// First suggestion

jQuery(document).ready(function($) {
    $('#terminal').terminal(function(cmd, term) {
         term.echo('\nClick this: <a onClick="javascript:terminal.exec(\'somethingelse\')">somethingelse</a>', {raw: true});
    }, {
        greetings: "Welcome!\n",

        onInit: function(terminal) {
            $('.trigger-terminal').click(function() { terminal.exec(); });

            terminal.echo('Welcome!');
        },
        prompt: '> '
    });

// Second suggestion

jQuery(document).ready(function($) {
    $('#terminal').terminal(function(cmd, term) {
         term.echo('\nClick this: <a onClick="javascript:terminal.exec(\'somethingelse\')">somethingelse</a>', {raw: true});
    }, {
        greetings: "Welcome!\n",

        onInit: function(terminal) {
            window.terminal = terminal;
            terminal.echo('Welcome!');
        },
        prompt: '> '
    });
});

edited May 24, 2015 at 4:32

answered May 24, 2015 at 4:13

fny

33.9k17 gold badges103 silver badges135 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

ieatpizza Over a year ago

Neither of those seemed to do anything. There weren't any errors.

fny Over a year ago

Update has the solutions embedded in the code you provided.

user4466350 Over a year ago

terminal is a property of $("#terminal"); it does not exist as a reference itself. IE : $('#terminal').terminal <-!

user4466350 · Accepted Answer · 2015-05-24 04:32:38Z

0

Variable can t be access. Also take care that terminal is a property of $('#terminal")

Solution 1

jQuery(document).ready(function($) {
    $('#terminal').terminal(function(cmd, term) {
         term.echo('\nClick this: '+$('<a></a>').text('somethingelse').on('click', function(){$('#terminal').terminal.exec();}), {raw: true});
    }, {
        greetings: "Welcome!\n",

        onInit: function(terminal) {
            terminal.echo('Welcome!');
        },
        prompt: '> '
    });
});

Solution 2

jQuery(document).ready(function($) {
    $('#terminal').terminal(function(cmd, term) {
         term.echo('\nClick this: <a onClick="javascript:$("#terminal").terminal.exec(\'somethingelse\')">somethingelse</a>', {raw: true});
    }, {
        greetings: "Welcome!\n",

        onInit: function(terminal) {
            terminal.echo('Welcome!');
        },
        prompt: '> '
    });
});

wrote on the fly, i hope it is correct. But the idea is there.

answered May 24, 2015 at 4:32

user4466350

1 Comment

user4466350 Over a year ago

Just so this signature $('#terminal').terminal(function(cmd, term) { maybe you hsould use term and not terminal, but that is related to your library documentation, right ?

Collectives™ on Stack Overflow

jQuery - How to call a function in another scope

2 Answers 2

3 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related