2017-05-15 20 views
1

私はオプションで値を選択し、この値をdivに渡すオプションを持つhtml selectを1つ持っています。このdiv私は入力フィールドを作成している私のAutoVal JavaScript値を通過しています。私がしたいと思うようにすべてが創造して働いていますし、CSSもまた私は信じていますが、私のBackgroungdのイメージはここでは適用されません。誰かが私に何が欠けているかを教えてもらえますか?背景画像にCssが適用されていません

AutoVal = function(args) { 
 
    debugger; 
 
    var divID = args.divID; 
 
    var div = document.getElementById(divID); 
 
    var input = '<input type="text" id="myInput" onclick="myFunction()" title="Type in a name">'; 
 
    div.innerHTML = input; 
 
}
#myInput { 
 
    background-image: url('Drop.png'); 
 
    background-position: 10px 10px; 
 
    background-repeat: no-repeat; 
 
    width: 30%; 
 
    font-size: 16px; 
 
    padding: 12px 20px 12px 40px; 
 
    border: 1px solid #ddd; 
 
    margin-bottom: 12px; 
 
}
<!DOCTYPE html> 
 
<meta charset="utf-8"> 
 
<head> 
 
    <title>PC-AutoCombo </title> 
 
    <link rel="stylesheet" type="text/css" href="css/AutoVal.css"> 
 
    <script src="js/PC.AutoVal.js"></script> 
 
</head> 
 

 
<body> 
 
    <select id="mySelect" onchange="myFunction()"> 
 
      <option value="Val1">Val1</option> 
 
      <option value="Val2">Val2</option> 
 
     </select> 
 
    <div id="Val" style="position: relative;"></div> 
 
</body> 
 
<script> 
 
    function myFunction() { 
 
    var val = document.getElementById("mySelect").value; 
 
    var myVal = new AutoVal({ 
 
     "url": "data.json", 
 
     "divID": "Val", 
 
    }); 
 
    switch (val) { 
 
     case 'Val1': 
 
     break; 
 
     case 'Val2 : 
 
     var myVal = new AutoVal({ 
 
     "url": "data.json", 
 
     "divID": "AutoVal", 
 
     }); 
 
     break; 
 
    } 
 
    }

答えて

2

あなたのcase 'Val2 :宣言にアポストロフィが欠落しています。

それが問題を修正しているように見えるの追加、ここでの作業のデモです:このことができますhttps://jsfiddle.net/v2o2nmpj/

希望!

+0

私はそれが私が逃したタイプミスであると仮定します。実際に私がチェックしたところでは '' der ''なので。 – David

+0

My Assumptionは、私がエディタで使用しているコードではなく、stackoverflowに配置したコードにあります。 – David

+0

フィドルをチェックして、それがあなたの要求に応じて動作しているかどうかを確認してください –

関連する問題