时间戳

首页 > 解决方案 > 我在javascript输出中遇到问题它没有显示

javascript - 我在javascript输出中遇到问题它没有显示

问题描述

我想用 CSS、表单、javascript 解决这个问题，我尝试使用 javascript 并包含 3 个 if 语句，但它并没有真正向我显示输出，是因为 if 语句每个都应该用括号括起来吗？或者我写变量的方式可能有错误我尝试了很多东西，但它不起作用请帮助我仍然是一个初学者程序员，我无法弄清楚

  

 function myFunction(){
          
var Fname= document.getElementById("fname").value;
var Lname= document.getElementById("lname").value;
var Name = Fname + "   " + Lname;

var date= document.getElementById("date").value;



var tr= document.getElementById("t").value;

var tour= document.getElementById("tour").value;

var request= document.getElementById("request").value;

var v = Number(document.getElementById("visitor").value);
var city = document.getElementById("city").value;
var x="";
var y="";
var z="";
    var total=x+y+z;



{
        if (v<=0){

                v=prompt(" minimum visitors are 1 try again");
                }
             
            
         else if (city == "Amman $50") {
         x = v * 50; 
         } 

         else if (city == "Salt $20")  {

         x = v * 20;
         }  

         else   {

         x = v * 10;
         }

  }
  
  {
  
           if ( tour==Yes )
                 {
             y= 50;
                  }
            else {
             y=x;
                 }
               }

{              

            if (trans==Car)
                {
                z= 30;
                        }

                 else{
                 z=20;
                      }
    
    }

document.getElementById("result").innerHTML = "Arrival date" + date + "<br>"
+ Name.toUpperCase() + 
"<br>"+" City " + city + v + "visitors"
+"<br>" + " transportation " + tr + 
"<br>" + "tour leader :" + tour 
"<br>"+ "any medical:" + request +
"<br>" +"Amount=$ " + total ;

return false;
};
  

 body{
margin:20px;
text-align:center;
}

form{
background-color:orange;
}

div.sec {
margin-left:300px;
}




div.transpo {
margin-right:450px;
}
<h3 style="text-align:center"> <span style="color:red;font-size:40px;">V</span>isit <span style="color:red;font-size:40px;">J</span> ordan </h3>

<form>
  <div class="transpo">
    <input type="text" id="fname" size="30" placeholder="First Name">
    <br><br>
    <select id="city">
      <option value="select your city "> Select your city </option>
      <option value="50 ">Amman $50</option>
      <option value="20 ">Salt $20</option>
      <option value="10 ">Jarash $10</option>
    </select>
    <br><br>
    <label><b>Number of visitors</b></label>
    <br>
    <input type="number" id="visitor">

    <br><br>

    <label style="margin-right:10px;"><b> Transportation</b></label>
    <br>
    <input type="radio" id="car" name="transportation" value="car" id="t">
    <label id="car" for="car">car $30</label>
    <input type="radio" id="bus" name="transportation" value="bus" id="t">
    <label for="bus">bus 20$</label><br>
  </div>

  <div class="sec">
    <input type="text" id="lname" size="30" placeholder="Last Name">

    <br><br>
    <label><b>Arrival Date:</b></label><br>
    <input type="date" id="date">

    <br><br>

    <label><b> Any medical Request:</b></label>
    <br>
    <textarea rows="1" cols="20" id="request"></textarea>

    <br><br>
    <label><b> Tour Leader $50</b></label>
    <br>
    <input type="radio" id="yes" name="tour" value="yes" id="tour">
    <label for="yes">yes</label>
    <input type="radio" id="no" name="tour" value="no" id="tour">
    <label for="no">no</label><br>
  </div>





  <button type="button" onclick="myFunction()"> PREVIEW </button>
  <button type="submit" onClick=""> Submit </button>
</form>

<p style="background-color:#99ccff;width:420px;font-weight: bold;" id="result"> </p>

<p style="background-color:#99ccff;width:420px;font-weight: bold;" id="result2"> </p>

标签： javascripthtmlcss

解决方案

如果您在浏览器中打开控制台（默认按 F12），您会看到 Javascript 返回错误。

Uncaught SyntaxError: "" string literal contains an unescaped line break

这是指第 174 行和第 176 行缺少两个引号，文件末尾都缺少这两个引号。

但是您的代码仍然无法正常工作，如果您按预览，则会收到另一个错误

<input type="radio" id="car" name="transportation" value="car" id="t">
<input type="radio" id="bus" name="transportation" value="bus" id="t">

在这两行中，您指定 id 两次，这是不允许的。

提示，以便您可以更轻松地自行解决这些问题：

  • 您应该开始使用控制台来查找代码中的错误。
  • 尝试重新阅读您的代码并查找诸如缺少“
  • 如果您不确定 html 或 javascript 功能是如何工作的，请使用 w3school 之类的网站查找详细说明的文档。

祝你在未来的编码冒险中好运。

推荐阅读