从jQuery模板中发出Javascript

如何解决从jQuery模板中发出Javascript

|| 我想从jQuery模板发出一些js，例如我有类似的模板

<script id=\"tmplID\" type=\"text/x-jQuery-tmpl\">
<input id=\"static.${val}\" type=\"text\"/>
<input id = \"static2.${val}\" type=\"text\"/>
<script type=\"text/javascript\">
$(\'#static.\'+${val}).change(function(){
  alert(\'some value\');
});
</script>
</script>  

当我这样称呼此模板时：

var obj = {val:\'123\'};
$(\'#tmplID\').tmpl(obj).appendTo(\"some_container\");

它在页面上将JavaScript更改功能呈现为字符串，而我希望将其作为可执行JavaScript附加。     

解决方法

        您的代码有多个问题。 首先，永远不要使用嵌套的

<script>

标签。即使

</script>

标记位于javascript块中的字符串内，您仍应拆分它，以使它不会按原样显示，因为它可能并且甚至会使最符合标准的浏览器跳闸。更不用说年长的了... 同样，您应该避免在ID中使用点，因为在编写jQuery选择器时很容易忽略。

#id.something

表示\“选择ID为

id

的元素，该元素也已应用类别

something

\”。如果您不能没有它，可以在编写选择器（如

#id\\\\.something

）时将其转义，这将“选择ID为

id.something

\的元素”。 将javascript放在模板中也是一个坏主意，您应该重新考虑您要实现的目标。几乎总有一种解决方法： 您可以将事件与

.delegate()

或

.live()

绑定到将来只会创建的元素。 您可以使用其他选择器，例如使用您可以将一个唯一的类与上述绑定一起使用，以免干扰现有的标记。如果您需要事件处理程序中的ID，可以使用

this.id

或

$(this).attr(\'id\')

轻松提取它。 如果要在脚本中自定义“ 13”，则可以向元素添加自定义属性，例如

<input id=\"static_something\" data-custom=\"some value\" />

，然后使用

$(this).data(\'custom\')

将其提取到您的函数中。 考虑到以上所有因素，我将您的代码重新编写为类似于以下内容的代码：

<script id=\"tmplID\" type=\"text/x-jquery-tmpl\">
<input id=\"static_${val}\" class=\"templateinput\" type=\"text\" data-custom=\"value1\" />
<input id=\"static2_${val}\" class=\"templateinput\" type=\"text\" data-custom=\"value2\" />
</script>

<script type=\"text/javascript\">
// jQuery ready function
$(function(){
    $(\'.templateinput\').live(\'change\',function(){
        var element_id = this.id;
        var element_data = $(this).data(\'custom\');

        alert(\'The value of input #\' + element_id + \' is: \' + element_data);
    });
});
</script>

如果您有一个将包含所有模板项目的已知容器，请使用ѭ9代替，以免产生全局绑定。     ,        您能否在渲染模板后立即设置事件？

var obj = {val:\'123\'};
$(\'#tmplID\').tmpl(obj).appendTo(\"some_container\");

$(\'#static.\'+obj.val).change(function() {
    ...
});