簡體   English   中英

在html頁面中使用多個不同的js文件的問題

[英]Problem in using multiple different js files in html page

我有兩個 js 文件,一個用於汽車品牌,另一個用於用戶位置。 我創建了一個表單並將它們添加到同一個 html 頁面中。 但是 js 文件最終可以正常工作,而上面的文件卻沒有。 是否有任何解決方案或方法可以在同一頁面中同時使用這兩個 js 文件。 所以它們都可以正常工作。 謝謝


function populatelocation(p1,c1){
var p1=document.getElementById(p1);
var c1=document.getElementById(c1);
c1.innerHTML="";
if (p1.value == "Azad Kashmir")
{
    var optionArray = ["|Select Location",
    "athmuqam|Athmuqam","bagh|Bagh","bhimber|Bhimber",
    "forward Kahuta|Forward Kahuta"];
}
else if (p1.value == "Balochistan")
{
    var optionArray = ["|Select Location",
    "awaran|Awaran","barkhan|Barkhan","chagai|Chagai",
    "dera Bugti|Dera Bugti","duki|Duki","gwadar|Gwadar","harnai|Harnai"];
}   
for (var option in optionArray)
{
var pair = optionArray[option].split("|");
var newOption = document.createElement("option");
newOption.value=pair[0];
newOption.innerHTML=pair[1];
c1.options.add(newOption);
}
}

function popuulatebrand(b1,m1){
 var b1=document.getElementById(b1);
 var m1=document.getElementById(m1);
 m1.innerHTML="";
 if (b1.value == "Audi")
 {
 var optionArray =  ['|Select Model 
 *',"A1|A1","A2|A2","TTS|TTS",'Other|Other'];
 }
 else if (b1.value == "BMW")
 {
 var optionArray = ["|Select Model","F06 06 
 SERIES|F06 06 SERIES","G02 X4|G02 X4",
 "G29 Z4|G29 Z4","G20 3 SERIES|G20 3 SERIES",
 "I01 I3|I01 I3","I12 I8|I12 I8",'Other|Other'];
  } 
  else if (b1.value == "Other")
  {
  var optionArray = ['other|Other'];
  }
  for (var option in optionArray){
 var pair = optionArray[option].split("|");
 var newOption = document.createElement("option");
 newOption.value=pair[0];
 newOption.innerHTML=pair[1];
 m1.options.add(newOption);
 }
 }

<script src="js/location.js" type="text/javascript"></script>
<script src="js/brandmodel.js" type="text/javascript"></script>
 <body>
  <div>
    <select  class="form-control " id="brand" name="brand" onchange="populatebrand(this.id,'model')">
          <option value="">Choose...</option>
                    <option value="Audi" >Audi</option>
                    <option value="BMW" >BMW</option>
     </select>
    <select class="form-control" id="model">
           <option value="" >Choose...</option>
    </select>
   </div>
    <div>
    <select class="form-control" name="province" id="province" onchange="populatelocation(this.id,'city')">
          <option value="">Choose Province...</option>
                <option value="Azad Kashmir">Azad kashmir</option>
                 <option value="Balochistan">Balochistan</option>
     </select>
     <select class="form-control" name="city" id="city">
                <option>Choose Location...</option>
     </select>
    </div>
    </body>

首先,我可以在您的代碼中看到一個簡單的錯誤。 您在函數定義中的populatebrand中有兩個 u。

我在修復此問題后測試了您的代碼,然后出現以下錯誤(來自brandmodel.js 腳本):

SyntaxError: Invalid or unexpected token

發生此錯誤是因為在定義optionArray您已將某些字符串/元素拆分為新行。 你應該在同一行完成你的字符串。

您的代碼如下:

var optionArray = ['|Select Model 
 *',"A1|A1","A2|A2","TTS|TTS",'Other|Other'];

通過這些更正,您的函數將如下所示:

function populatebrand(b1,m1){
  var b1=document.getElementById(b1);
  var m1=document.getElementById(m1);
  m1.innerHTML="";
  if (b1.value == "Audi")
  {
    var optionArray =  ['|Select Model*',"A1|A1","A2|A2","TTS|TTS",'Other|Other'];
  }
  else if (b1.value == "BMW")
  {
    var optionArray = ["|Select Model","F06 06 SERIES|F06 06 SERIES","G02 X4|G02 X4",
  "G29 Z4|G29 Z4","G20 3 SERIES|G20 3 SERIES",
  "I01 I3|I01 I3","I12 I8|I12 I8",'Other|Other'];
  } 
  else if (b1.value == "Other")
  {
    var optionArray = ['other|Other'];
  }
  for (var option in optionArray){
    var pair = optionArray[option].split("|");
    var newOption = document.createElement("option");
    newOption.value=pair[0];
    newOption.innerHTML=pair[1];
    m1.options.add(newOption);
  }
}

我已經用這些更改測試了代碼,現在可以識別兩個腳本中的函數(即使它們位於單獨的 js 文件中)。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM