在parse / backbone / js / html中使用模板时,Id重复

时间:2014-11-04 06:38:40

标签: html parsing templates backbone.js duplicates

当我在渲染函数中设置视图时,我得到重复的ids

var template = _.template($("#user-login-template").html(), {});
this.$el.html(template);

在运行render函数之前,html在运行render函数后看起来像这样。事先,<div class ="app">为空(应该是)。它复制粘贴模板中的代码,因此将ID粘贴到div中。

<div class="app">
<input type="text" id="signup-username" placeholder="Username"/>
<input type="password" id="signup-password" placeholder="Create a Password"/>                                                                                                                                                              
<button id="signUpBtn">Sign Up</button>
<button id="logInBtn">Login</button>
</div>
<!-- Templates -->
<!-- Login Template -->
<script type="text/template" id="user-login-template">
    <input type="text" id="signup-username" placeholder="Username"/>
    <input type="password" id="signup-password" placeholder="Create a Password"/>
    <button id="signUpBtn">Sign Up</button>
    <button id="logInBtn">Login</button>
</script>

供参考,这就是我的整个观点

var LogInView = Parse.View.extend({
    el: '.app',
    events: {
        "click .signUpBtn": "signUp",
        "click .logInBtn": "logIn"
    },
    initialize: function (){
        this.render()
    },
    logIn: function () {
        //To Do
    },
    render: function () {
        var template = _.template($("#user-login-template").html(), {});
        this.$el.html(template);
    }
});

1 个答案:

答案 0 :(得分:1)

如果Webstorm抱怨id内的<script>,那么它就错了,你有三个选择:

  1. 获取一个更好理解HTML的新IDE。
  2. 弄清楚如何重新配置​​Webstorm以了解HTML究竟是什么。必须有一种方法可以在Webstorm中击败某种感觉,这种事情现在非常普遍。
  3. 忽略警告(哎呀)。
  4. <script>内的内容不是HTML,也不是DOM的一部分。询问浏览器在呈现模板后$('input[type=text]').length是什么,从

    开始,您将获得1
    <input type="text" id="signup-username" placeholder="Username"/>
    
    <script>内的

    不是HTML,只是文本。您甚至可以查看HTML specification of <script>

      

    允许的内容
      不可替换的字符数据

    不可替换的字符数据不是HTML,只是文本。