javascript更改事件在bootply中不起作用

我想在選擇器/組合框更改時更改網站上的圖片。它完美的作品在bootply，但看起來既不在當地ENV沒有抓到變化事件，也沒有在Appspot上...javascript更改事件在bootply中不起作用

的HTML代碼：

<head> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
    <script src="/static/js/nbafantasy.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js" ></script> 
    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css"> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js"></script> 
</head> 
<body> 
    Eastern conference 
    <div class="form-group"> 
     <img src="http..."> 
     <select class="custom-select mb-2 mr-sm-2 mb-sm-0" id="11a" name="11a"> 
      <option>-</option> 
      <option>4:0</option> 
      <option>4:1</option> 
      <option>4:2</option> 
      <option>4:3</option> 
      <option>3:4</option> 
      <option>2:4</option> 
      <option>1:4</option> 
      <option>0:4</option> 
     </select> 
     <img src="..."> 
    </div> 
    <div clas

的JS：

$('#11a').on('change', function (e) { 
    console.log('fired'); 
    if((document.getElementById('11a').value).charAt(0) == "4") { 
     document.getElementById("21aimg").src="http...."; 
    }else{ 
     document.getElementById("21aimg").src="http....."; 
    } 
});

來源

2017-04-14 Delceg

您的圖片元素沒有ID。 – Titus

您必須包裝在$(document).ready(fn)塊的事件綁定：

$(document).ready(function() { // <---ensures that DOM is ready to use 
    $('#11a').on('change', function(e) { // <---now it will be bound on target element 
    console.log('fired'); 
    if (this.value.charAt(0) == "4") { 
     document.getElementById("21aimg").src = "http...."; 
    } else { 
     document.getElementById("21aimg").src = "http....."; 
    } 
    }); 
});

來源

2017-04-14 10:56:13 Jai

javascript更改事件在bootply中不起作用

回答

相關問題