Блоки Drupal - два javascripts, которые работают независимо как блоки, не работают при размещении на одной странице

Question

мои первые скрипты, наконец, работают независимо как блоки на сайте drupal. Проблема в том, что мне нужно, чтобы они работали в блоках бок о бок на одной странице. Когда я пытаюсь это сделать, работает только один из них. Искали вокруг, чтобы попытаться найти решение - все переменные и элементы уникальны, но все еще кажется конфликтом. Вот коды:

Блок 1 Код:

<script type="text/javascript"> 
(function(){ 
    "use strict"; 
    window.getRisk = function() 
{ 
    var size = window.document.getElementById('An_Size').value; 
    var location = window.document.getElementById('locate').value; 
    var ysah = window.document.getElementById('yessah'); 
    var nsah = window.document.getElementById('nosah'); 

    var x=size; 
    var y=location; 
     var z=ysah.checked?"yes":"no"; 

    if(x==0  ) output(" --/--") 
    if(x>0&& x<7  && y=="ant" && z=="no" ) output(" 1 /0 ") 
    if(x>=7&& x<12 && y=="ant" && z=="no" ) output(" 0.9948 /2.6 ") 
    if(x>=12&&x<25 && y=="ant" && z=="no" ) output(" 0.971 /14.5 ") 
    if(x>=25 && y=="ant" && z=="no" ) output(" 0.92 /40 ") 
    if(x>0&& x<7   && y=="post" && z=="no" ) output(" 0.995 /2.5 ") 
    if(x>=7&& x<12 && y=="post" && z=="no" ) output(" 0.971 /14.5 ") 
    if(x>=12&&x<25 && y=="post" && z=="no" ) output(" 0.9632 /18.4 ") 
    if(x>=25 && y=="post" && z=="no" ) output(" 0.9 /50 ") 
    if(x>0&& x<7   && y=="int"  && z=="no" ) output(" 1 /0 ") 
    if(x>=7&& x<12 && y=="int"  && z=="no" ) output(" 1 /0 ") 
    if(x>=12&&x<25 && y=="int"  && z=="no" ) output(" 0.994 /3 ") 
    if(x>=25 && y=="int"  && z=="no" ) output(" 0.9872 /6.4 ") 
    if(x>0&& x<7  && y=="ant" && z=="yes" ) output(" 0.997 /1.5 ") 
    if(x>=7&& x<12 && y=="ant" && z=="yes") output(" 0.9948 /2.6 ") 
    if(x>=12&&x<25 && y=="ant" && z=="yes" ) output(" 0.971 /14.5 ") 
    if(x>=25 && y=="ant" && z=="yes" ) output(" 0.92 /40 ") 
    if(x>0&& x<7  && y=="post" && z=="yes" ) output(" 0.9932 /3.4 ") 
    if(x>=7&& x<12 && y=="post" && z=="yes" ) output(" 0.971 /14.5 ") 
    if(x>=12&&x<25 && y=="post" && z=="yes" ) output(" 0.9632 /18.4 ") 
    if(x>=25 && y=="post" && z=="yes" ) output(" 0.9 /50") 
    if(x>0&& x<7   && y=="int"  && z=="yes" ) output(" 1 /0 ") 
    if(x>7&& x<12  && y=="int"  && z=="yes" ) output(" 1 /0 ") 
    if(x>=12&&x<25 && y=="int"  && z=="yes" ) output(" 0.994 /3 ") 
    if(x>=25 && y=="int"  && z=="yes" ) output(" 0.9872 /6.4 ") 

}; 

function output(str) 
{ 
    var arr = str.split("/"); 
    var one_yr_risk = parseFloat(arr[0]); 
    var life_expectancy = parseFloat(window.document.getElementById('life_expectancy').value); 
    var cum_risk="--"; 
    var five_yr_risk="--" 
    { 
     five_yr_risk = arr[1]; 
     cum_risk = Math.round(((1-Math.pow((one_yr_risk), life_expectancy))*100)*10)/10; 
    } 
    window.document.getElementById('r2').value=five_yr_risk;  
    if(life_expectancy<10) 
     cum_risk="--"; 

    if(cum_risk===0) 
     cum_risk="0*"; 

    window.document.getElementById('r1').value=cum_risk; 
    } 
}()); 

     </script> 

    <img alt="" src="/sites/default/files/COW.gif" style="width: 250px; height: 284px; border-width: 0px; border-style: solid; margin: 0px;" /> 
    <form action="" id="riskform" onSubmit="return false;"> 
    <fieldset> 
    <label for="locate">Location</label> 
    <select id="locate" name='locate' 
    onchange="getRisk()"> 
    <option value="ant">Anterior circulation</option> 
    <option value="post">Posterior circulation (incl. PCom)</option> 
    <option value="int">Intracavernous</option> 

    </select> 
    <br> 
    <br> 
    <p> 
    <label class="inlinelabel" for='includeinscription'> 
    Size(mm)</label> 
    <input type="text" id="An_Size" size=7 onKeyUp="getRisk()" 
    name="size" value="0" /> 
    </p> 
    <label >Previous SAH?</label> 
    <input type="radio" name="prevsah" value="yessah" id="yessah" 
    onclick="getRisk()" /> 
    Yes 
    <input type="radio" name="prevsah" value="nosah" id="nosah" 
    onclick="getRisk()" /> 
    No 
    <br> 
    <br>  
    <label for="Five_Year">5 Year Rupture Risk (%)</label> 
    <input type="text" name="val3" id="r2"><span id="result2"></span> 
     <p> 
    <p> 
    <br> 
    <label class="inlinelabel" for='includeinscription'> 
    Estimated life expectancy (minimum 10 years)</label> 
    <input type="text" id="life_expectancy" size=7 onKeyUp="getRisk()" 
    name="size" value="0" /> 
    </p> 

    <label for="One_Year">Cumulative Lifetime Rupture Risk (%)</label> 
    <input type="text" name="val3" id="r1"><span id="result1"></span> 

    <div id="Final_Risk"></div> 

    </fieldset> 
    </form> 

Блок 2 Код:

 <script type="text/javascript"> 
(function(){ 
    "use strict"; 
    window.getRiskJp = function() 
{ 
    var sizejp = window.document.getElementById('An_Size_Jp').value; 
    var locationjp = window.document.getElementById('location_Jp').value; 

    var a=sizejp; 
    var b=locationjp; 


     if(a<3  ) output(" --/--") 
     if(a>=3&& a<5  && b=="mca" ) output(" 0.9977 /0.23 ") 
     if(a>=5&& a<7  && b=="mca" ) output(" 0.9969 /0.31 ") 
     if(a>=7&& a<10 && b=="mca" ) output(" 0.9844 /1.56") 
     if(a>=10&& a<25 && b=="mca" ) output(" 0.9589 /4.11 ") 
     if(a>=25&& b=="mca" ) output(" 0.8313 /16.87") 
     if(a>=3&& a<5   && b=="aca" ) output(" 0.991 /0.90 ") 
     if(a>=5&& a<7  && b=="aca" ) output(" 0.9925 /0.75 ") 
     if(a>=7&& a<10 && b=="aca" ) output(" 0.9803 /1.97") 
     if(a>=10&& a<25 && b=="aca" ) output(" 0.9476 /5.24 ") 
     if(a>=25&& b=="aca"  ) output(" 0.6023 /39.77") 
     if(a>=3&& a<5   && b=="ica" ) output(" 0.9986 /0.14 ") 
     if(a>=5&& a<7  && b=="ica" ) output(" 1 /0 ") 
     if(a>=7&&a<10  && b=="ica" ) output(" 0.9881 /1.19") 
     if(a>=10&&a<25 && b=="ica" ) output(" 0.9893 /1.07 ") 
     if(a>=25&& b=="ica"  ) output(" 0.8939 /10.61") 
     if(a>=3&& a<5   && b=="icapcomm"  ) output(" 0.9986 /0.41 ") 
     if(a>=5&& a<7  && b=="icapcomm"  ) output(" 1 /1 ") 
     if(a>=7&&a<10  && b=="icapcomm"  ) output(" 0.9881 /3.19") 
     if(a>=10&&a<25 && b=="icapcomm"  ) output(" 0.9893 /6.12 ") 
     if(a>=25&& b=="icapcomm"  ) output(" 0/around 100") 
     if(a>=3&& a<5   && b=="bassca"  ) output(" 0.9977 /0.23 ") 
     if(a>=5&& a<7  && b=="bassca"  ) output(" 0.9954 /0.46 ") 
     if(a>=7&& a<10 && b=="bassca"  ) output(" 0.9903 /0.97 ") 
     if(a>=10&& a<25 && b=="bassca"  ) output(" 0.9306 /6.94 ") 
     if(a>=25&& b=="bassca"  ) output(" 0 /around 100") 
     if(a>=3&& a<5   && b=="vert"  ) output(" 1 /0 ") 
     if(a>=5&& a<7  && b=="vert"  ) output(" 1 /0 ") 
     if(a>=7&& a<10 && b=="vert"  ) output(" 1 /0 ") 
     if(a>=10&& a<25 && b=="vert"  ) output(" 0.9651 /3.49 ") 
     if(a>=25&& b=="vert"  ) output(" 1 /0") 
     if(a>=3&& a<5   && b=="other"  ) output(" 0.9922 /0.78 ") 
     if(a>=5&& a<7  && b=="other"  ) output(" 0.9863 /1.37") 
     if(a>=7&& a<10 && b=="other"  ) output(" 1 /0 ") 
     if(a>=10&& a<25 && b=="other"  ) output(" 0.9719 /2.81 ") 
     if(a>=25&& b=="other" ) output(" 1 /0 ") 

}; 

function output(str) 
{ 
    var arrj = str.split("/"); 
    var one_br_risk = parseFloat(arrj[0]); 
    var life_eapectancb = parseFloat(window.document.getElementById('life_eapectancb').value); 
    var cum_riskj="--"; 
    var five_br_risk="--" 
    { 
     five_br_risk = arrj[1]; 
     cum_riskj = Math.round(((1-Math.pow((one_br_risk), life_eapectancb))*100)*10)/10; 
    } 
    window.document.getElementById('r2j').value=five_br_risk; 
    if(life_eapectancb<1) 
     cum_riskj="--"; 

    if(cum_riskj===0) 
     cum_riskj="0*"; 

    window.document.getElementById('r1j').value=cum_riskj; 
    }; 
}()); 

     </script> 

     <br> 
     <form action="" id="riskformj" onSubmit="return false;"> 
     <fieldset> 
     <label for="loc">Location</label> 
     <select id="location_Jp" name='location_Jp' 
     onchange="getRiskJp()"> 
     <option value="mca">Middle cerebral</option> 
     <option value="aca">Anterior communicating</option> 
     <option value="ica">Internal carotid</option> 
     <option value="icapcomm">Internal carotid - posterior communicating</option> 
     <option value="bassca">Basilar tip/superior cerebellar</option> 
     <option value="vert">Vertebral/PICA/vertebrobasilar junction</option> 
     <option value="other">Other location</option> 

    </select> 
    <br> 
    <br> 
    <p> 
    <label class="inlinelabel" for='includeinscription'> 
    Size(mm) (minimum 3mm)</label> 
    <input type="text" id="An_Size_Jp" size=7 onKeyUp="getRiskJp()" 
    name="sizejp" value="0" /> 
    <p> 
    <label class="inlinelabel" for='includeinscription'> 
    Life expectancy (minimum 1 year)</label> 
    <input type="text" id="life_eapectancb" size=7 onKeyUp="getRiskJp()" 
    name="sizejp" value="0" /> 
    </p> 
    <br> 
    <p> 
    <label for="Five_bear">1 year Rupture Risk (%)</label> 
    <input type="text" name="val3jp" id="r2j"><span id="result2jp"></span> 
     <p> 
    <label for="One_bear">Cumulative Lifetime Rupture Risk (%)</label> 
    <input type="text" name="val3jp" id="r1j"><span id="result1jp"></span> 

    <div id="Final_Risk_Jp"></div> 

    </fieldset> 
    </form> 

Answer 1

Так кажется, что вы не используете замыкания вокруг вашего кода, это важно, так как любой код не в закрытии является глобальным. Как таковые сейчас и функции output существуют ... но которые использует браузер ... это чья-то догадка. Затвор выглядит следующим образом:

(function(){ 
"use strict"; 
window.getRisk = function(){ your code }; 
function output() {your code }; 
}()); 
(function(){ 
"use strict"; 
window.getRiskJp = function() { your code }; 
function output(){ your code }; 
}()); 

Пожалуйста, обратите внимание, что я определяю функции, которые должны быть видимы снаружи крышки на объекте окна, иначе они не будут видны для обратных вызовов.