Question

首先，我乘用javascript div和之後的功能無法正常工作

function setDoorCount(count) { 
    $('.doors').html(''); 
    for (var i = 0; i < count; i++) { 
     var content = "<div class='door' data-door='" + i + "'><img id='door-id-" + i + "' src='' /></div>"; 
     $('.doors').append(content); 
    } 
} 

之後，試圖打開對話框，並不能正常工作，因爲它應該

var selectedDoorId = 0; 
var openDialog = function() { 
    selectedDoorId = $(this).attr('data-door'); 
    $('.dialog-button').click(function() { 
     var color = $(this).attr('id'); 
     document.getElementById('door-id-' + selectedDoorId).src = 'http://www.#.asd' + color + '.png'; 
     $('#door-panel-color').dialog('close'); 
    }); 
    $('#door-panel-color').dialog('open'); 
} 
$(function() { 
    $("#door-panel-color").dialog({ 
     autoOpen: false, 
     minHeight: 'auto', 
     width: 650, 
     modal: true, 
     open: function(){ 
      $('.ui-widget-overlay').bind('click',function(){ 
       $('#door-panel-color').dialog('close'); 
      }) 
     } 
    }) 
    $('.door').click(openDialog); 
}); 

HTML：

<div class="doors"> 
    <div class="door" data-door="0"> 
     <img class="door-color" id="door-id-0" src="http://liukuovitukku.fi/images/door-colors/pahkina.png" /> 
    </div> 
</div> 

Answer 1

你需要我的代碼來替換你的兩個函數如下：

function checkDoorCount(count) { 
      if (parseInt(count.value) != 0) { //I made change here 
       if (count.value != 0) { 
        setDoorCount(count.value); 
       } 
      } else { 
       document.getElementById('door-count').innerHTML = '<font color="#F00">cant be letter</font>'; 
      } 
     } 
     function setDoorCount(count) { 
      alert(count) 
      $('.doors').html(''); 
      for (var i = 0; i < count; i++) { 
       var content = "<div class='door' data-door='" + i + "'><img id='door-id-" + i + "' src='#'/></div>"; 
       $('.doors').append(content); 
      } 
      $('.door').click(openDialog); //added this statement 
     }