2012-05-03 21 views
7

में चेक किए गए चेकबॉक्स को अपडेट नहीं किया गया है। मुझे जेएस द्वारा चेकबॉक्स की जांच करने में कोई समस्या है। जब मैंने जेएस द्वारा चेकबॉक्स चेक किया है तो यह प्रोग्राम में ऐसा लगता है कि यह चेक किया गया है लेकिन यूआई में यह अपडेट नहीं हुआ है।यूआई

अगर किसी को भी इस

<!DOCTYPE html> 
<html> 
    <head> 
    <title>Check</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" /> 
    <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> 
    <script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script> 
    <script>  
    function getCheckedValue() 
    { 
    return ((document.getElementById("rock").checked)); 

    } 

    function setCheckedValue(toBeChecked){ 
     document.getElementById(toBeChecked).checked="checked"; 
     alert((document.getElementById(toBeChecked).checked)) 
     alert($('#'+toBeChecked).attr('checked')) 
    } 
    </script> 
</head> 
<body> 
<div data-role="page"> 
    <div data-role="header"> 
      <h1>What kind/s of music do you listen to?</h1> 
    </div><!-- /header --> 
    <div data-role="content"> 
     <input type="checkbox" class="music" name="music" id="rock" value="rock" > 
     <label for="rock">Rock</label> 
     <input type="button" value="Get" onclick="alert(getCheckedValue())"> 
     <input type="button" value="Set" onclick="setCheckedValue('rock') "> 
    </div> 
</div> 
</body> 
</html> 
+0

आपको अपने प्रश्न का एक स्वीकार्य जवाब मिला है, तो [कृपया के रूप में स्वीकार जवाब निशान।] (Http://meta.stackexchange.com/a/5235/171858) –

उत्तर

1

मैंने आपके सभी प्रयासों से प्रतिक्रिया प्राप्त करने के बाद काम किया है और कार्य कोड नीचे है।

<!DOCTYPE html> 
<html> 
    <head> 
    <title>Check</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" /> 
    <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> 
    <script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script> 
    <script>  
    function getCheckedValue() 
    { 
    return (document.getElementById("rock").checked); 
    //return $('input[name=music]').checked; 
    } 

    function setCheckedValue(checkboxName,toBeChecked){ 
     $('input[name='+checkboxName+']').prop("checked", true).checkboxradio("refresh"); 
    } 
    </script> 
</head> 
<body> 
<div data-role="page"> 
    <div data-role="header"> 
      <h1>What kind/s of music do you listen to?</h1> 
    </div><!-- /header --> 
    <div data-role="content"> 
     <input type="checkbox" class="music" name="music" id="rock" value="rock" > 
     <label for="rock">Rock</label> 
     <input type="button" value="Get" onclick="alert(getCheckedValue())"> 
     <input type="button" value="Set" onclick="setCheckedValue('music','rock') "> 
    </div> 
</div> 
</body> 
</html> 
15
इसके बजाय attr मैं करूंगा का उपयोग करने का

के लिए समाधान है अत्यधिक आप prop का उपयोग करें।

if (elem.checked) 
if ($(elem).prop("checked")) 
if ($(elem).is(":checked")) 
:

वरीय क्रॉस-ब्राउज़र-संगत निर्धारित करने के लिए एक चेकबॉक्स चेक किया गया है जिस तरह से निम्न में से एक का उपयोग कर तत्व की संपत्ति पर एक "truthy" मूल्य के लिए जाँच करने के लिए है

.prop() विधि को .attr() विधि के बजाय अक्षम और चेक करने के लिए उपयोग किया जाना चाहिए। मूल्य प्राप्त करने और सेट करने के लिए .val() विधि का उपयोग किया जाना चाहिए।

$("input").prop("disabled", false); 
$("input").prop("checked", true); 
$("input").val("someValue"); 
0

function setCheckedValue(toBeChecked){ 
    document.getElementById(toBeChecked).checked=true; 
    alert((document.getElementById(toBeChecked).checked)) 
    alert($('#'+toBeChecked).prop('checked')) 
} 
0

Jquery-मोबाइल ऐसी बातों के लिए कक्षाओं संलग्न कर देता है की कोशिश करो।

<div class="ui-checkbox"> 
    <input type="checkbox" class="music" name="music" id="rock" value="rock"> 
    <label for="rock" data-corners="true" data-shadow="false" data-iconshadow="true" data- wrapperels="span" data-icon="checkbox-off" data-theme="c" class="ui-btn ui-btn-corner-all ui-btn-icon-left ui-checkbox-off ui-checkbox-on ui-btn-up-c"> 

    <span class="ui-btn-inner ui-btn-corner-all"> 
     <span class="ui-btn-text">Rock</span> 
     <span class="ui-icon ui-icon-checkbox-off ui-icon-shadow">&nbsp;</span> 
    </span> 
    </label> 
</div> 

आपको क्या करने की जरूरत है हटा दें और लेबल और अवधि टैग करने के लिए कक्षाओं में जोड़ने के लिए एक रास्ता खोजने है: मूल रूप से है कि एक इनपुट/लेबल जोड़ी के भीतर आप निम्नलिखित है। मैंने लेबल के लिए यह किया है, लेकिन अवधि के लिए नहीं, क्योंकि आखिर में मुझे कुछ नींद आ रही है।

function setCheckedValue(toBeChecked){ 
    document.getElementById(toBeChecked).checked="checked"; 
    $("label[for='rock']").addClass("ui-checkbox-off"); 
    $("label[for='rock']").addClass("ui-checkbox-on"); 
} 

मैं को भूल गए हैं किया:

$("#checkbox-label").checkboxradio("refresh"); 

से: http://forum.jquery.com/topic/what-is-the-most-effective-way-of-unchecking-a-checkbox

नहीं पूरी तरह से एक ही सवाल है, मुझे पता है, लेकिन थोड़ा प्रासंगिक। मुझे इसके साथ जुड़ने और इसे काम करने का मौका नहीं मिला ... और न ही मैंने यह देखने के लिए और अधिक देखा कि यह काम भी करता है या नहीं।

संक्षेप में, संपत्ति को "चेक" पर सेट किया जा रहा है, हालांकि, तत्वों को नए 'राज्य' को समायोजित करने के लिए अपने सीएसएस को ताज़ा करने की आवश्यकता है।

मुझे आशा है कि इससे मदद मिलती है!

+0

धन्यवाद वहाँ समर्थन के लिए हर एक , अब सभी जवाब देखने के बाद मैं अपने समाधान पर पहुँच गए हैं नीचे कोड समारोह setCheckedValue (toBeChecked) { \t \t //document.getElementById(toBeChecked).checked="checked "है; \t \t $ ("इनपुट [नाम = संगीत]")। प्रोप ("चेक", सत्य); \t \t $ ("लेबल [के लिए = 'रॉक']")।addClass ("ui-चेकबॉक्स-ऑन"); \t \t $ ("अवधि")। AddClass ("ui-icon-checkbox-on"); \t} –

+0

मुझे स्पैन में शैली देने का कोई तरीका है ... जैसा कि मैंने चेकबॉक्स के लिए अवधि शैली दी है, यह सभी अवधि तत्व –

+0

सुमित के लिए लेता है, मैं इसे थोड़ी देर बाद देखता हूं जब मैं घर से मिलता हूं काम करें और आपको कुछ पता चलेगा तो मुझे बताएं। मैंने कल रात को काम करने के लिए कोशिश करने की कोशिश की, लेकिन असफल रहा। – Chase