javascriptでチェックされている場合は、「古い」電話機にチェックボックスのチェックマークが表示されません

Question

おはようございます。

function checkbox_tick_action(){ 
$("#mt-container #option").prop('checked',true); 
$("#mt-container #option").attr('checked','checked'); 
console.log("ticked"); 
} 

提出にバインドさ： 私はフォームを送信するためにチェックしなければなりませんオプション（チェックボックス）があり、フォームのページをしましたので、基本的にこのような単純なjavascriptのがありますイベント。 かなり、罰金が、いくつかの携帯電話上のこの作品は、チェックボックスは更新されませんので、これは起こる：

フォームは、（チェックボックスがチェックされているが、チェックを外すと示す）提出されています。 が次のページに上がって、戻るボタンを押すと、チェックボックスがチェックされています。 私はいくつかのテストをしましたが、私は "DOMを更新する"か、単にチェックボックスの新しい "ビジュアル"を表示しないものがあるかどうかを確認しています。

誰もがこの問題を解決するヒントを持っていますか？

js経由で要素のレンダリングを強制する方法はありますか？

これは実際にはほとんどのデバイスで機能していることに注意してください。

この問題が発生しているデバイスの1つにSamsung ACEがあり、在庫ブラウザを使用しています。

この問題が発生しているすべての携帯電話は、何らかの形で日付が付いています。

Android搭載端末には、主に2.3.3以下の問題があります。

は、私はこれを試してみる： 関数checkbox_tick_action（）{実際には運と

$("#mt-container #option").prop('checked',true); 
$("#mt-container #option").attr('checked','checked'); 
var opt = document.getElementById('option'); 

opt.style.display='none'; 
opt.offsetHeight; 
opt.style.display='block'; 
console.log("tick 2"); 

を。

HTMLは次のとおりです。

<input type="checkbox" name="option" id="option" value="true" data-tid="checkBox"> 

CSS：

#mt-container input:not(checked) + label:before { 
border: 1px solid #3E3E3E; 
background-color: #EFEFEF; 
content: "\00a0"; 
display: inline-block; 
width: 14px; 
height: 14px; 
font-size:15px; 
line-height: 15px; 
} 
#mt-container input:checked + label:before { 
border: 1px solid #3E3E3E; 
background-color: #EFEFEF; 
color: #3E3E3E; 
content: "\2714"; 
font-size: 15px; 
text-align: center; 
line-height: 15px; 
font-weight: bold; 
} 

#mt-container input:checked, #mt-container input:not(checked) { 
position:absolute; 
top:-500px; 
left:-900px; 
} 

Answer 1

あなたは

$("#option").parent().addClass("is-checked"); 

として、要素の 親に "-チェックされている" クラスを追加し、Googleの材料設計を使用している場合

視覚化をレンダリングする。これがうまくいくことを願います！