Question

如果在下拉列表中选择了汽车，我基本上想要显示图像。每次我更改代码时，if语句停止工作并且图像永远不会出现。我是编码的新手，我不确定如何去做。任何帮助，将不胜感激。

HTML

<script src="Script\configurator.js" type="text/javascript"></script>

<a> First Select a Car Make </a>
<form name="CarConfigurator">
<select name="Car_make" onchange="Transmission(this.value);">
  <option value=" " selected="selected">None</option>
  <option value="1">Audi RS6</option>
  <option value="2">BMW M4</option>
  <option value="3">Mercedes C63 AMG</option>
 </select>
 <br>
 <br>

 <select name="A_M" >
<option value="0" selected="selected">None</option>
<option value="1" selected="selected">Automatic</option>
<option value="2" selected="selected">Manual</option>

</select>

</form>

的Javascript

function Transmission(Car) {

  var make = document.CarConfigurator.A_M;

  make.options.length = 0;

  if (Car == "1") {

    make.options[make.options.length] = new Option('Automatic', '1');

    make.options[make.options.length] = new Option

      ('Manual', '2');

  }

  if (Car == "2") {

    make.options[make.options.length] = new Option('Manual', '2');


  }

  if (Car == "3") {

    make.options[make.options.length] = new Option('Automatic', '3');

  }


}

Answer 1

我更改了一些代码，因为我无法使用它。试试这个。

<form name="CarConfigurator">
<select name="Car_make">
  <option value="" selected="selected">None</option>
  <option value="1">Audi RS6</option>
  <option value="2">BMW M4</option>
  <option value="3">Mercedes C63 AMG</option>
 </select>
 <br>
 <br>

 <select name="A_M" >
<option value="0" selected="selected">None</option>
<option value="1">Automatic</option>
<option value="2">Manual</option>

</select>

</form>

 <br>
 <br>

<img id="carImage" style="width:500px">

<script src="https://code.jquery.com/jquery-3.1.1.js"></script>
<script>
    function transmission(car, option) {

    if (car == "1" && option == "1") { // Audi RS6 | Automatic
      $("#carImage").attr('src',"https://upload.wikimedia.org/wikipedia/commons/thumb/7/70/Audi_RS6_-_Mondial_de_l'Automobile_de_Paris_2014_-_001.jpg/280px-Audi_RS6_-_Mondial_de_l'Automobile_de_Paris_2014_-_001.jpg");

    } else if (car =="2" && option == "2") { // BMW M4 | Manual
      $("#carImage").attr('src',"http://buyersguide.caranddriver.com/media/assets/submodel/7774.jpg");

    } else if (car == "3" && option == "1") { // Mercedes C63 AMG | Automatic
      $("#carImage").attr('src',"http://images.cdn.autocar.co.uk/sites/autocar.co.uk/files/styles/gallery_slide/public/mercedes-benz-c63-amg-1.jpg?itok=yHBoS8gg");

    } else {
      $("#carImage").attr('src',"");

    }

    }

    $("select").on("change",function(){
      var selectCar = $("select[name=Car_make]");
      var selectCarOption = $("select[name=A_M]");
      transmission(selectCar.val(), selectCarOption.val());
    });

</script>

使用Javascript从IF语句中显示图像

1 个答案: