|
|
|
ช่วยด้วยค่ะ!!!! ต้องการเปลี่ยน Checkbox เป็น Image ยังไงคะ รบกวนด่วนทีค่ะ |
|
|
|
|
|
|
|
Code (PHP)
<input type="checkbox" id=check_type1 value="1" src="images/menubutton.png" onClick="showAndHide('target1',this.checked)" name=check_type1>
ลองดูครับ
|
|
|
|
|
Date :
2016-06-16 17:03:20 |
By :
stepartz |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ตอบความคิดเห็นที่ : 2 เขียนโดย : because เมื่อวันที่ 2016-06-16 17:23:55
รายละเอียดของการตอบ ::
ถ้าเป็นแบบนี้ คุณต้องไปกำหนดที่ตัว javascript แล้วครับว่าเมื่อกดที่รูกให้โชว์คำว่าอะไร ขอโทษด้วยครับผมดูผิด
Code (PHP)
function setCheckboxImageSrc(checkbox, image, checkedUrl, uncheckedUrl) {
if (checkbox.is(":checked")) {
image.attr("src", checkedUrl);
} else {
image.attr("src", uncheckedUrl);
}
}
function setCheckboxImage(checkboxObj, className, checkedUrl, uncheckedUrl) {
checkboxObj.hide();
var $image = $("<img src='" + checkedUrl + "' />").insertAfter(checkboxObj);
setCheckboxImageSrc(checkboxObj, $image, checkedUrl, uncheckedUrl);
$image.click(function () {
var $checkbox = $image.prev("." + className);
$checkbox.click();
setCheckboxImageSrc($checkbox, $image, checkedUrl, uncheckedUrl);
});
}
$(".checkboxUp").each(function () {
setCheckboxImage($(this), "checkboxUp", "../../../images/DirectionUpChecked.png", "../../../images/DirectionUpUnchecked.png");
});
$(".checkboxDown").each(function () {
setCheckboxImage($(this), "checkboxDown", "../../../images/DirectionDownChecked.png", "../../../images/DirectionDownUnchecked.png");
});
ลองดูโค้ดอันนี้ครับ ผมไม่สะดวกในการทดลองให้ก่อน
|
ประวัติการแก้ไข 2016-06-16 17:30:48
|
|
|
|
Date :
2016-06-16 17:28:55 |
By :
stepartz |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ใช้ jquery ช่วย
Code (JavaScript)
<input type=checkbox onclick="$(this).hide(); $('img').show()">
<img src="?????" onclick="$(this).hide(); $('input').show()" style="display:none" >
|
|
|
|
|
Date :
2016-06-16 17:52:00 |
By :
Chaidhanan |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Code (PHP)
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('#Menu').hide();
$('#Chk').click(function(){
$('#Menu').show();
});
});
</script>
</head>
<body>
<input type="checkbox" id="Chk"> Check Menu <br/>
<select id="Menu">
<option>Plase Selected</option>
</select>
</body>
</html>
ลองประยุคใช้รวมกับบทความนี้ดูครับ
https://www.thaicreate.com/community/custom-checkbox-radio-with-css.html
|
|
|
|
|
Date :
2016-06-16 18:01:44 |
By :
Ex-[S]i[L]e[N]t |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Load balance : Server 04
|