Question

我想使用switchcase Javascript来加载图像。但我有一个问题，如何将图像加载到switchcase脚本，需要你的帮助或建议：）

<div align='center'>
<fieldset>
<legend><b>Detail Onsite</b></legend>

Dari :
<select class='form-control'> 
<option value='co'>Cyber Office</option>    
</select><br><br/></br>

Tujuan PM :
<select class='form-control' id='tujuan' name='tujuan'>
<option value='abb'>ABB Sakti Industri</option>
<option value='ace'>ACE Life Assurance</option>
</select><br><br/></br>

<a href='javascript:void(0)' id='submit'>Submit</a>

<script>

document.getElementById('submit').onclick = function(){
document.getElementById('output').style.display = "block";

  var myImage = document.getElementById('tujuan');
  var tujuan  = document.getElementById('tujuan').value;

  switch(tujuan){

    case "abb":
      myImage("abb.jpg");
      break;

    case "ace":
      myImage("ace.jpg");
      break;

    case "cigna":
      myImage("cigna.jpg");
      break;    
    }
}

</script>
</body>
</html>

Answer 1

以下代码段有效。选择option，然后点击Submit。此外，您的代码还有几个问题：

您错过了image元素，该元素将保存由switch块确定的图像
您错过了标识为output的元素，因此我只是为此示例选择了带有该ID的<span>元素。
myImage不是像myImage("abb.jpg");一样调用的setter函数。这不会设置任何值。

document.getElementById('submit').onclick = function(){
document.getElementById('output').style.display = "block";

  var imageHolder = document.getElementById('imageLink');
  var myImage = document.getElementById('tujuan');
  var tujuan  = document.getElementById('tujuan').value;
  switch(tujuan){

    case "abb":
      imageHolder.src = "http://4.bp.blogspot.com/-bbubO_FJ7Qk/ToW1yQSzZhI/AAAAAAAAABY/k23rQV4C_Qg/s1600/free.jpg";
      break;

    case "ace":
       imageHolder.src = "http://www.allyou.com/sites/default/files/image/2014/01/300x300/i/2010/09/freesample-m.jpg";
      break;
      break;

    case "cigna":
      imageHolder.src = "http://4.bp.blogspot.com/-bbubO_FJ7Qk/ToW1yQSzZhI/AAAAAAAAABY/k23rQV4C_Qg/s1600/free.jpg";
      break;
      break;    
    }
}

<div align='center'>
<fieldset>
<legend><b>Detail Onsite</b></legend>

Dari :
<select class='form-control'> 
<option value='co'>Cyber Office</option>    
</select><br><br/></br>

Tujuan PM :
<select class='form-control' id='tujuan' name='tujuan'>
<option value='abb'>ABB Sakti Industri</option>
<option value='ace'>ACE Life Assurance</option>
</select><br><br/></br>

<image id='imageLink' src='' alt='Image here'/>
<a href='javascript:void(0)' id='submit'>Submit</a>
<span id='output'></span>

HTML-Javascript：使用Switchcase加载图片

1 个答案: