如何通过单个index.html处理BackboneJS中多个元素的加载?

时间:2014-08-27 05:51:31

标签: html backbone.js backbone-events

我在 加载元素ID 的元素时出现问题。

我的要求是加载多种语言的网页。我已经为此完成了javascript函数。它通过按钮点击事件(onclick)工作。但是当我从form-1(通过BackboneJS)渲染表单2时,它不会工作。 我发现,问题是加载元素ID为的元素。因为在第一次加载form-1时,form-2元素没有加载(将form-2元素的长度显示为零)。

在表单2中,它通过按钮单击事件(onclick)成功运行。 我只想从form-1渲染form-2,使用单选按钮中的选定语言作为index.html 中的常用元素。

请按照代码段进行操作。

在视图中

render: function(){
        this.$el.html(_.template($('#formVisitor').html(), this.visitor.toJSON()));
        $(document).ready(function() {
            if(document.getElementById("linkNL").checked){
                langCheck('NL');
            }else if(document.getElementById("linkFR").checked){
                langCheck('FR');
            }else if(document.getElementById("linkEN").checked){
                langCheck('EN');
            }
        });
        return this;
    }

在HTML中

<ul class="navbarLang">
       <li><input type="radio" name="Lang" value="NL" id="linkNL" onclick="langCheck('NL');">NL</li>
       <li><input type="radio" name="Lang" value="FR" id="linkFR" onclick="langCheck('FR');">FR</li>
       <li><input type="radio" name="Lang" value="EN" id="linkEN" checked="checked" onclick="langCheck('EN');">EN</li>
</ul>

的Javascript

// initialized the params
var linkHead = "";
var link1 = "";        
var link2 = "";        
var link3 = "";
var msg = "";
var profile = "";
...........................
..............................


function loadFR(){
  <!-- page1 -->
    linkHead = "Obtenez l'accès rapide ";
    link1 ="Visiteurs";
    link2 ="Pharmaciens";
    link3 ="Exposants";   

  <!-- page2 -->
    headMsg = "Farma inscription";
    msg = "Veuillez sélecter votre langue et ensuite votre profil pour vous pré enregistrer pour le salon FARMA 2014. Si vous êtes pharmacien, votre N° APB est requis à l’inscription.";
     profile = "Profil "+"<span style='color: red;'>*</span>"+" : ";

     profile_0 = "Choisissez votre profil";
     profile_2 = "Industrie pharmaceutique";
     profile_3 = "Hôpital";
     profile_4 = "Société/Institution";
     profile_5 = "Université";
     profile_6 = "Association";
     profile_7 = "Biologie Clinique";
     profile_8 = "étudiant";
     profile_10 = "wetr";   

     proceed = "Procéder";   
     cancel = "Annuler";
}
function langCheck(lang){
    if(lang == "EN"){
         this.loadEN();
    }
    if(lang == "NL"){
         this.loadNL();
    }
    if(lang == "FR"){
         this.loadFR();
    }
// Elements in form1           
    document.getElementById('quickAccessDisp').innerHTML = linkHead;
    document.getElementById('access1Disp').innerHTML = link1;
    document.getElementById('access2Disp').innerHTML = link2;
    document.getElementById('access3Disp').innerHTML = link3;

// Elements in form2        
   document.getElementById('profileDisp').innerHTML = profile;
   document.getElementById('profile_0Disp').innerHTML = profile_0;
   document.getElementById('profile_2Disp').innerHTML = profile_2;
   document.getElementById('profile_3Disp').innerHTML = profile_3;
   document.getElementById('profile_4Disp').innerHTML = profile_4;
   document.getElementById('profile_5Disp').innerHTML = profile_5;
   document.getElementById('profile_6Disp').innerHTML = profile_6;                    
   document.getElementById('profile_7Disp').innerHTML = profile_7;                     
   document.getElementById('profile_8Disp').innerHTML = profile_8;                      
   document.getElementById('profile_10Disp').innerHTML = profile_10;                       
   document.getElementById('proceedDisp').innerHTML = proceed;
   document.getElementById('cancelDisp').innerHTML = cancel;

// common elements
   document.getElementById('placeMessageHead').innerHTML = headMsg;
   document.getElementById('placeMessage').innerHTML = msg;

}

有意义!! !!

请帮我解决此问题。提前谢谢。

1 个答案:

答案 0 :(得分:0)

如果没有一些错误消息和更多代码,很难说,但我猜你有一个范围问题。在langCheck中,您使用“this”来调用loadFR。