可摺疊的分度頭中的複選框，jQuery Mobile的

這是我的html代碼：可摺疊的分度頭中的複選框，jQuery Mobile的

<!DOCTYPE HTML> 
<html> 
<head> 
    <meta name="viewport" content="width=device-width,initial-scale=1"/> 
    <link rel="stylesheet" href="css/jquery.mobile-1.2.0.min.css" /> 
    <link rel="stylesheet" href="css/styles.css" /> 
</head> 
<body> 

<div id="questionsPage" data-role="page" data-add-back-btn="true"> 

<div data-role="header"> 
    <h1>Questions</h1> 
</div> 

<div data-role="content"> 
<div id="questions_list" data-role="collapsible-set" data-theme="a" data-content-theme="d" data-inset="false"></div> 
</div> 

</div> 
<script src="js/jquery.js"></script> 
<script src="js/jquery.mobile-1.2.0.min.js"></script> 
<script src="js/questions_list.js"></script> 
</body> 

</html>

，這是question_list.js：

$('#questionsPage').live('pageshow', function(event) { 
    var id = getUrlVars()["id"]; 
    $.getJSON(serviceURL + 'api/questions.json?id=' + id, function(data) { 
     questions = data; 
     $.each(questions, function(index, question) { 
      $('#questions_list').append('<div data-role="collapsible" id="section_' + question.id + '">' + 
             '<h2>' + question.question + '<input type="checkbox" id="checkbox_' + question.id + '" /></h2>' + 
             '<p>test</p></div>'); 
      $('#section_' + question.id).collapsible(); 
     }); 
    }); 
}); 

function getUrlVars() { 
    var vars = [], hash; 
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&'); 
    for(var i = 0; i < hashes.length; i++) 
    { 
     hash = hashes[i].split('='); 
     vars.push(hash[0]); 
     vars[hash[0]] = hash[1]; 
    } 
    return vars; 
}

好吧，我可以看到的複選框的div。但是，當我點擊複選框，div被摺疊，複選框沒有被檢查。

我想要的是，當我點擊複選框時，它將被檢查。而當我點擊其他任何地方，只有div會崩潰沒有複選框被檢查。

非常感謝！

來源

2012-10-26 Shayka

我期待在你的代碼現在，到目前爲止，我不能說我完全弄清楚你的解決方案，但是，我可以說，我有一個插件可以幫助你處理那個令人討厭的小url功能。 [見這裏]（http://spyk3lc.blogspot.com/2012/03/jquery-myurl-extension-how-to-get-that.html） – SpYk3HH

沒有一個例子，有點需要更好地解決你的問題，我我不太清楚這個問題嗎？ – SpYk3HH

不要參考代碼，該腳本通過ajax將可摺疊的div添加到collapsible-set中。接下來的可摺疊標題，我想添加一個複選框，所以當我點擊這個複選框，它將被檢查沒有div摺疊 – Shayka

右後：

$('#questions_list').append('<div data-role="collapsible" id="section_' + question.id + '">' + 
             '<h2>' + question.question + '<input type="checkbox" id="checkbox_' + question.id + '" /></h2>' + 
             '<p>test</p></div>');

插入：

// This will simply stop the check box from allowing its parent to be clicked (collapsed) while the checkbox itself is clicked 
// I havn't tested, but should work 
$('#checkbox_' + question.id).on("click", function(e) { e.stopPropagation(); });

來源

2012-10-26 19:42:02 SpYk3HH

好男人我有一個錯誤：「Uncaught TypeError：Object [object Object] has'method'on' – Shayka

我成功了！我將它改爲$（'＃checkbox_'+ question.id） .click（.... 謝謝！ – Shayka

大聲笑，np，如果你沒有.on，你必須運行舊版本？ – SpYk3HH

可摺疊的分度頭中的複選框，jQuery Mobile的

回答

相關問題