在 Yii 2 中使用 jQuery Mobile答案

【问题标题】：using jQuery Mobile in Yii 2在 Yii 2 中使用 jQuery Mobile
【发布时间】：2017-02-12 12:55:15
【问题描述】：

我是新的 Yii 2 开发者！我创建了一个如下所示的网格视图：

<?php Pjax::begin()?>
    <?= GridView::widget([
        'dataProvider'   => $dataProvider,
        'filterModel' => $searchModel,
        'columns' => [
            ['class' => 'yii\grid\ActionColumn'],
            'id',
            'countrydate',
            'countryName'=>[
                'attribute'=>'countryName',
                'content' => function($model,$key,$index,$column) {
                      return Html::a(
                '<div data-role="main" class="ui-content">'
                   .'<a href="#myPopup'.$key.'" data-rel="popup" class="ui-btn ui-btn-inline ui-corner-all">'
                     .'<span id="countryNamevalue'.$key.'">'.$model->countryName.'</span>'
                   .'</a>'
                   .'<div data-role="popup" id="myPopup'.$key.'" class="ui-content">'
                     .'<h2 id="a'.$key.'">enter the new data</h2>'
                     .'<input id="myinput'.$key.'" type="text" >'
                     .'<button onclick=showcountryCode(myinput'.$key.'.value,'.$key.') >Submit</button>'
                   .'</div>'
                .'</div>'
                        ,null
                        ,$options = [
                        'id'=>'countryCode'.$key,
                        'style'=>['border'=>'none' , 'background'=>'none'],
                    ]);
                }
            ],
            'countryName',
            'countrydate',
            'population',
            'fipsCode',
        ],
    ]); ?>
    <?php Pjax::end()?>

如您所见，我在 'countryName' 的 My php 文件中使用了 jQuery Mobile。现在这张照片是我的网站Pic

但是当我更改页面时，我的页面将是这样的：enter image description here

你可以看到所有被隐藏的 jQuery MObile 行在新页面中突然显示块，我必须刷新页面来解决这个问题！！！

谁能告诉我该怎么做才能解决这个问题？

【问题讨论】：

你能告诉我们你正在运行的 JS 吗？
@D.Mill 我做到了，在我的代码行 13 中！，在第 13 行我启动 JQuery Mobile !!!
我看不到您加载 JS 文件的位置或它们在您的问题中包含的内容。例如showcountryCode() 定义在哪里？此外，我觉得奇怪的是，您将所有 div 和锚点都包含在锚点中。这可能会在某些平台上产生错误，因为它不符合 html5 标准
啊哈！！！ function showcountryName(name,id) { var xmlhttp; if (window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest(); } else { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange = function () { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { window.alert(this.responseText); document.getElementById("countryNamevalue"+id).innerHTML = name; } }
和：xmlhttp.open("GET","crudphp/editcountryName.php?q="+q+"&name="+name,true); xmlhttp.send(); } showcountryCode 是 showCounteryName 我今天早上改名了！！！ @D.Mill

标签： php jquery jquery-mobile yii yii2

【解决方案1】：

这里的问题是，当您动态更改内容（例如通过 pjax）时，jQuery mobile 的“自动功能”不会重新加载。

为了使它工作，您需要在每次 pjax 成功事件后运行 .enhanceWithin()。我建议将以下内容添加到您的页面 JS（不是列）中：

$(document).on('pjax:success', function(data, status, xhr, options){
   $('body').enhanceWithin();
})

对于以前版本的 jQuery Mobile (.trigger('create') 而不是 .enhanceWithin()。

见：jQuery Mobile does not apply styles after dynamically adding content

【讨论】：

我将您的代码复制到我的脚本标签中，没有任何问题！！！我做对了吗？ @D.Mill
如果你在函数里面放了一个警报，当你改变页面时你会得到一个警报吗？