Question

我正在学习javascript，并尝试制作一个基于选项的简单程序。当用户根据汽车型号选择收音机盒时，将显示。当用户选择车型时，其价格应打印或发出警告。第一个用户选项有效，但第二个（汽车模型）未调用我的js函数，请帮助这是代码。

<!DOCTYPE html>
<html>

<head>
  <title>Modal</title>

  <script type="text/javascript">
    function show(p) {
      alert(p);
      document.getElementById(p).style.display = "block";
      return 1;
    }
  </script>
  <script type="text/javascript">
    function select(Rs) {
      alert("HAHAHAHAH" + Rs);
      document.write("HAHAHAHAH <br>" + Rs);
    }
  </script>
</head>

<body>

  BMW : <input type="radio" name="cars" id="BMW" onclick="show('BMWModels')"><br> Ferrari : <input type="radio" name="cars" id="Ferrari" onclick="show('FerrariModels')"><br> Maruti : <input type="radio" name="cars" id="Maruti" onclick="show('MarutiModels')"><br>

  <div id="BMWModels" style="display: none">
    <!--HERE IF I WRITE onclick="alert('price for this model is xxxxx ')" 
    then it works properly..-->
    <!-- 
      I tried calling the function from browser console then it works properly please kindly guide me..
    -->
    BMW Model 1 : <input type="radio" name="BMW" onclick="select(1)"><br> BMW Model 2 : <input type="radio" name="BMW" onclick="select('10000000 Rs')"><br> BMW Model 3 : <input type="radio" name="BMW" onclick="select('10000000 Rs')"><br>

  </div>

  <div id="FerrariModels" style="display: none">
    Ferrari Model 1 : <input type="radio" name="fmodels" onclick="select('10000000 Rs')"><br> Ferrari Model 2 : <input type="radio" name="fmodels" onclick="select('10000000 Rs')"><br> Ferrari Model 3 : <input type="radio" name="fmodels" onclick="select('10000000 Rs')"><br>
  </div>

  <div id="MarutiModels" style="display: none">
    Maruti Model 1 : <input type="radio" name="Mmodels" onclick="select('10000000 Rs')"><br> Maruti Model 2 : <input type="radio" name="Mmodels" onclick="select('10000000 Rs')"><br> Maruti Model 3 : <input type="radio" name="Mmodels" onclick="select('10000000 Rs')"><br>
  </div>
</body>

</html>

Answer 1

由于select是javascript中的reserved words之一，因此您需要将函数selectRs的名称更改为select。

function show(p) {
  alert(p);
  document.getElementById(p).style.display = "block";
  return 1;
}

function selectRs(Rs) {
  alert("HAHAHAHAH" + Rs);
  document.write("HAHAHAHAH <br>" + Rs);
}

BMW : <input type="radio" name="cars" id="BMW" onclick="show('BMWModels')"><br> Ferrari : <input type="radio" name="cars" id="Ferrari" onclick="show('FerrariModels')"><br> Maruti : <input type="radio" name="cars" id="Maruti" onclick="show('MarutiModels')"><br>

<div id="BMWModels" style="display: none">
  <!--HERE IF I WRITE onclick="alert('price for this model is xxxxx ')" 
    then it works properly..-->
  <!-- 
      I tried calling the function from browser console then it works properly please kindly guide me..
    -->
  BMW Model 1 : <input type="radio" name="BMW" onclick="selectRs(1)"><br> BMW Model 2 : <input type="radio" name="BMW" onclick="selectRs('10000000 Rs')"><br> BMW Model 3 : <input type="radio" name="BMW" onclick="selectRs('10000000 Rs')"><br>

</div>

<div id="FerrariModels" style="display: none">
  Ferrari Model 1 : <input type="radio" name="fmodels" onclick="selectRs('10000000 Rs')"><br> Ferrari Model 2 : <input type="radio" name="fmodels" onclick="selectRs('10000000 Rs')"><br> Ferrari Model 3 : <input type="radio" name="fmodels" onclick="selectRs('10000000 Rs')"><br>
</div>

<div id="MarutiModels" style="display: none">
  Maruti Model 1 : <input type="radio" name="Mmodels" onclick="selectRs('10000000 Rs')"><br> Maruti Model 2 : <input type="radio" name="Mmodels" onclick="selectRs('10000000 Rs')"><br> Maruti Model 3 : <input type="radio" name="Mmodels" onclick="selectRs('10000000 Rs')"><br>
</div>

Answer 2

有一些保留关键字，您不能使用它们来命名函数，变量等。不幸的是，select是这些保留关键字之一，因此您需要将函数的名称更改为其他名称，如下所示。

有关保留关键字的列表，您可以查看那些here。

<!DOCTYPE html>
<html>

<head>
  <title>Modal</title>

  <script type="text/javascript">
    function show(p) {
      alert(p);
      document.getElementById(p).style.display = "block";
      return 1;
    }
  </script>
  <script type="text/javascript">
    function selectRs(Rs) {
      alert("HAHAHAHAH" + Rs);
      document.write("HAHAHAHAH <br>" + Rs);
    }
  </script>
</head>

<body>

  BMW : <input type="radio" name="cars" id="BMW" onclick="show('BMWModels')"><br> Ferrari : <input type="radio" name="cars" id="Ferrari" onclick="show('FerrariModels')"><br> Maruti : <input type="radio" name="cars" id="Maruti" onclick="show('MarutiModels')"><br>

  <div id="BMWModels" style="display: none">
    <!--HERE IF I WRITE onclick="alert('price for this model is xxxxx ')" 
    then it works properly..-->
    <!-- 
      I tried calling the function from browser console then it works properly please kindly guide me..
    -->
    BMW Model 1 : <input type="radio" name="BMW" onclick="selectRs(1)"><br> BMW Model 2 : <input type="radio" name="BMW" onclick="selectRs('10000000 Rs')"><br> BMW Model 3 : <input type="radio" name="BMW" onclick="selectRs('10000000 Rs')"><br>

  </div>

  <div id="FerrariModels" style="display: none">
    Ferrari Model 1 : <input type="radio" name="fmodels" onclick="selectRs('10000000 Rs')"><br> Ferrari Model 2 : <input type="radio" name="fmodels" onclick="selectRs('10000000 Rs')"><br> Ferrari Model 3 : <input type="radio" name="fmodels" onclick="selectRs('10000000 Rs')"><br>
  </div>

  <div id="MarutiModels" style="display: none">
    Maruti Model 1 : <input type="radio" name="Mmodels" onclick="selectRs('10000000 Rs')"><br> Maruti Model 2 : <input type="radio" name="Mmodels" onclick="selectRs('10000000 Rs')"><br> Maruti Model 3 : <input type="radio" name="Mmodels" onclick="selectRs('10000000 Rs')"><br>
  </div>
</body>

</html>

Answer 3

尝试以下示例，您仍可以使用fU作为函数名：）

eU

select

P.S。不建议将function select(e) { console.log('currency selected =', this.value); } var inps = document.getElementsByName('currency'); for (var i = 0; inps.length > i; i++) { inps[i].onclick = select; }作为保留关键字之一使用这种名称。

单选框未调用Javascript函数

3 个答案: