Jquery Mobile 1.2多複選框選擇問題

Question

我正在編寫一個Jquery Mobile 1.2，Jquery 1.8.2，css和基於HTML 5的應用程序，我需要允許用戶選擇多個圖像並執行命令。

，如果我不使用jquery.mobile-1.2.0.min.js庫中的以下作品：

CSS代碼：

.image-checkbox-container input[type="checkbox"]{ 
    display: none; 
} 

.image-checkbox-container img{ 
    border: 0; 
    margin: 4px; 
} 

HTML：

<span class="image-checkbox-container"> 
    <input type="checkbox" name="black-box" value="1" /> 
<img src="dummyimage1.jpg" /> 
</span> 
<span class="image-checkbox-container"> 
    <input type="checkbox" name="red-box" value="1" /> 
    <img src="dummyimage2.jpg" /> 
</span> 
<span class="image-checkbox-container"> 
    <input type="checkbox" name="green-box" value="1" /> 
    <img src="dummyimage3.jpg" /> 
</span> 

的JQuery ：

$('.image-checkbox-container img').live('click', function(){ 
    if(!$(this).prev('input[type="checkbox"]').prop("checked")){ 
    $(this).prev('input[type="checkbox"]').prop("checked", true); 
    this.style.border = '4px solid #38A'; 
    this.style.margin = '0px'; 
}else{ 
     $(this).prev('input[type="checkbox"]').prop("checked", false); 
    this.style.border = '0'; 
    this.style.margin = '4px'; 
} 
}); 

只要我將jquery.mobile-1.2.0.min.js庫添加到代碼中，它就不能正常工作了。取消選中/取消選擇複選框不起作用。

我試圖使用checkboxradio（「刷新」），但沒有任何運氣。

任何建議將不勝感激。

感謝

Answer 1

怎麼樣使用一個CSS的解決方案？

添加另外這個自定義CSS：

.checked { 
    border : 4px solid #38A!important; 
    margin : 0px!important; 
} 

，並使用這個腳本：

<script> 
    $('.image-checkbox-container img').live('click', function(){ 
    $this=$(this); 
    if($this.hasClass('checked')===true){ 
     $this.removeClass('checked'); 
    }else{ 
     $this.addClass('checked'); 
    } 
    }); 
    </script>