Подтвердить что ты не робот

Jquery mobile collapsible и вкладка galaxy 10.1 Ответ json дает случайные ответы

Довольно новый для jquery mobile и новый для синтаксического анализа json - сделал много исследований безрезультатно. Попробовали задержку 10 секунд в функции settimeout

Мое приложение работает правильно на моей галактике s2 ssung, но на моем галактическом галактике Samsung 10.1 оно делает следующее.

Используя последние jquery 1.2.0 и jquery-1.7.2

Я вызываю getlocations2.php, и если я возвращаю четыре элемента или меньше, то сбрасываемый набор открывается и закрывается правильно. Если я верну 5 или более пунктов:

  • Я нажимаю на верхний складной, чтобы развернуть его - ничего не происходит
  • Я нажимаю на второй складной h3, и он открывает первый складной
  • после этого он может получить случайное расширение h3, но обычно это последний h3, который был затронут и не смог открыть.
  • он может работать корректно в течение короткого времени.

Спасибо за любые советы:

Код:

function doajax2($vurl,$vdata,$vtype,$vfrom){   
    $.ajax({
        url: $vurl,
        dataType: 'json',
        data:$vdata,
        async: false,
        success: function(rtndata) {
            $.mobile.hidePageLoadingMsg(); //alert(result.toSource())   
            rtndata2=(JSON.stringify(rtndata, null, 4));
            rtndata2=rtndata2.substring(13);
            rtndata2=rtndata2.slice(0, -2)

            var res = eval(rtndata2);           
            $('.displaylocations').html('');    
            g_html=res[0].brand;

            if (res[0].id> -1){
                g_html=g_html+'<div data-role="collapsible-set" data-theme="f" >';
                for (var i=0;i<res.length;i++){
                //for (var i=0;i<6;i++){            
                    lochtml('loc',i,res[i].locid,res[i].loccode1,res[i].head,res[i].desc,res[i].lang,res[i].lat1,res[i].long1,res[i].img1,res[i].limit);        
                }
                g_html=g_html+'</div>';
            }

            console.log('g_html'+g_html);
            $('.displaylocations').css('display','none');           
            $(".displaylocations").html(g_html);    
                    //  $(".displaylocations").html(str);   


            setTimeout(function(){ //make sure displaylocations has been updated
                $('#lhead2').html('Tuhura <span lang="en">Locations</span>');
                $('.displaylocations').trigger('create');
                $('.displaylocations').css('display','block');
                $( ".displaylocations" ).collapsibleset( "refresh" );

            },300);
        },
        error: function(faildata){
            switch ($vfrom) {
                case "region"   : $("#lhead3").html('Region Info Unavailable...');break
                case "locs"     :   $("#lhead2").html('Locations Unavailable...');break;
            }
        }
    });
}

function lochtml($vtype,$vno,$locid,$loccode1,$head,$desc,$vlang,$vlat1,$vlong1,$img1,$limit) {
console.log('lochtml '+$desc);
        g_html=g_html+  "<div class='locgoh'>";
        g_html=g_html+      '<a href="#" onclick="getsitedetails('+"'gps','"+$locid+"','"+$loccode1+"','s','sites','"+$vlang+"',1,0,'x',"+$vlat1+","+$vlong1+')">';
        g_html=g_html+ '<img src="http://tuhtop.co.nz/images/rightarrow.png" width="30px" height="30px" /></a>';                                                                            
        g_html=g_html+  '</div>';
        g_html=g_html+'<div data-role="collapsible" class="loccollapse" data-theme="f" div="coldiv">';              
        g_html=g_html+  '<h3>'+$head+'</h3>';                                               
        g_html=g_html+  '<p><div class="locli0">';                                  
        g_html=g_html+      '<span class="li1">' +$desc+ '</span>';                     
        g_html=g_html+      '<span class="li2"><a href="#" onclick="getsitedetails('+"'gps','"+$locid+"','"+$loccode1+"','s','sites','"+$vlang+"',1,0,'x',"+$vlat1+","+$vlong1+')">';
        g_html=g_html+      '<img src=\''+$img1+'\' width=\'120"\' height=\'120\' alt=\''+$img1+'\'/></a>';         
        g_html=g_html+      '</span>';      
        g_html=g_html+  '</div></p>';       
        g_html=g_html+'<div class="clearfloat"></div>';             
        g_html=g_html+'</div>';

}
4b9b3361

Ответ 1

Исправьте меня, если я ошибаюсь, насколько я могу судить при чтении ваших кодов, может быть несколько проблем

Прежде всего, ссылка переменной g_html, почему бы вам не вернуть html в функцию lochtml, а в вашем цикле for создать такой HTML-код, это более читаемо

    for (var i=0;i<res.length;i++){
        g_html=g_html+lochtml('loc',i,r...)
    }

Во-вторых, начальное значение g_html устанавливается на res [0].brand, что это значение?

В-третьих, это то, что создается для сбрасываемого набора div:

    the res[0].brand above 
    <div data-role="collapsible-set" data-theme="f">
        <div class='locgoh'>
            <a ...>
                <img />
            </a>
        </div>
        <div data-role="collapsible" class="loccollapse" data-theme="f" div="coldiv">
            <h3>...</h3>
            <p>...</p>
            <div class="clearfloat"></div>
        </div>
        ...
        ...
    </div>

Это не то, что jQuery Mobile ожидает от содержимого роли данных = "сборщик-набор", я предположил, что внутри должно быть только < div data-role = "collapsible" > внутри a < div data-role = "foldable-set" > . Я предлагаю вам переместить < div class= 'locgoh' > внутри <h3 >

Forth, нужна ли < div class= "clearfloat" > ? вы плавали тег p внутри складного? У меня возникла проблема, когда раньше я использовал "float" с некоторыми виджетами jQM. Кроме того, если clearfloat не нужно быть там, его лучше удалить.

Наконец, я думаю, что collapsibleset ('refresh') должен быть вызван в < div data-role = "collapsible-set" > не на его контейнер.