2016-09-18 6 views
1

データattrに基づいてjQueryで関数を作成しようとしています。jqueryデータ属性を持つ関数を作成する

<input type="text" name="name" id="name" data-validate="validatename" /> 

$("#name").blur(function(){ 
    var validate = $(this).attr("data-validate"); 
    var newvalidate = validate+"()"; 
    newvalidate; 
}); 

function validatename(){ 
    alert("success"); 
} 

デバッグがvalidatename()としてnewvalidateの値を与えるが、機能は実行されません。どのように私はこの作品を作ることができますか?

+0

代わりに 'newValidate'を導入する[検証]()' '窓、試してみてください。 –

+0

あなたは 'validate +"() ";'何を期待しているのですか?あなたが思っているのはそれが疑わしいからです(*ただの文字列*)。 –

答えて

3

newvalidate"validatename()"の値とより何も単なる文字列です。あなたはwindow[validate]()を行うことができます文字列として名前を持つグローバル関数を実行するには:

<input type="text" name="name" id="name" data-validate="validatename" /> 

$("#name").blur(function(){ 
    var validate = $(this).attr("data-validate"); 
    window[validate](); 
}); 

function validatename(){ 
    alert("success"); 
} 
5

()で終わる文字列を作成しても、その関数は実行されません。それはJavascriptのコードだかのように文字列を実行するには、eval()を呼び出す必要があります:

$("#name").blur(function(){ 
 
    var validate = $(this).attr("data-validate"); 
 
    var newvalidate = validate+"()"; 
 
    eval(newvalidate); 
 
}); 
 

 
function validatename(){ 
 
    alert("success"); 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" name="name" id="name" data-validate="validatename" />

また、単に機能そのものを取得し、それを呼び出すためにグローバル花茎に名前を調べることができます。それは機能しませんのでです

window[validate]() 
+1

ここで 'eval()'を使う必要はありません。 –

+0

する必要はありませんが、それを行う方法の1つです。 – Barmar

+0

はい、あなたができる方法ですが、ユーザー入力の対象となる 'eval'を使用することは決して良い考えではありません。特にそれが必要ではなく、おそらく遅い場合。 –

関連する問題