jQuery call function from a string [duplicate]

2019-01-10 10:16发布

问题:

This question already has an answer here:

  • How to execute a JavaScript function when I have its name as a string 31 answers

Is it possible to call a function by using the strings ?

(i.e) I have a variable var target = 'next';. Using this string I want to call the jquery method next() . Should i use target + '()' (this is bit foolish) to call next() ?

I know it can be done using conditional statements. Since it is a string got from users, but it is difficult to use conditional statements for all that.

In my jQuery plugin, users will pass the value prev, siblings etc as options, so that the respective jQuery methods will be executed.

How do I implement this ?

回答1:

You can use the bracket notation to access the member with a string containing the identifier:

var target = 'next';
$("foobar")[target]();    // identical to $("foobar").next()


回答2:

If you're wanting to use jQuery, the answer is quite elegant. Because jQuery is an object (which can be accessed like an array) - you can use $("selector")[target]().

Examples:

var target = 'next';
jQuery("selector")[target]();

This will work if you know that you can trust the input. However, if you're not sure of this, you should check that the function exists before trying to run it otherwise you'll get an error.

var target = 'doesNotExist';
if (jQuery.isFunction(target)) {
  jQuery('selector')[target]();
}


回答3:

In my case I needed to get the value from a rel attribute and then parse it as a function, this worked for me.

$jq('#mainbody form').submit(function(e){
    var formcheck = $jq(this).attr('rel');
    if (typeof window[formcheck] === 'function'){
        formok = window[formcheck]();
        e.preventDefault();
    }
});
function maincheck(){
    alert("Checked");
    return false;
}

and the form

<div id="mainbody">
<form action="mainpage.php" method="post" rel="maincheck">
<input type="hidden" name="formaction" value="testpost">
<label>Field 1 <input type="text" name="field1" value="<?=$_POST['field1'];?>"></label><br>
<label>Field 2 <input type="text" name="field2" value="<?=$_POST['field2'];?>"></label><br>
<input type="submit" value="Submit Form">
</form>
</div>