Explication détaillée d'exemples d'ouverture et de fermeture de couches contextuelles à l'aide de jQuery et de layer-js tutoriel-php.cn

Explication détaillée d'exemples d'ouverture et de fermeture de couches contextuelles à l'aide de jQuery et de layer

小云云

Libérer： 2018-05-24 14:21:21

original

3141 Les gens l'ont consulté

Cet article présente principalement jQuery et layer pour réaliser les fonctions d'ouverture et de fermeture du calque pop-up. Les amis qui en ont besoin peuvent s'y référer. J'espère que cela pourra aider tout le monde.

Ouvrez le calque contextuel :

Apportez layer.js sur la page de liste

Lorsque vous cliquez sur la page de liste, le calque contextuel du formulaire apparaît, liste .js :

$(".add_category,.update").click(function(){  
    //弹出框  
    var doMain = $(&#39;.domain_name&#39;).val();  
    layer.open({  
      shade: [0.5, &#39;#000&#39;, false],  
      type: 2,  
      area: [&#39;900px&#39;, &#39;530px&#39;],  
      fix: false, //不固定  
      maxmin: true,  
      title: [&#39;添加或修改用户类型&#39;, false],  
      content: doMain+"/Stat/QueryUserCategoryForm.action?adminUserCategory.id="+$(this).val()  
    });  
  });

Copier après la connexion

Lorsque vous cliquez sur le bouton "Enregistrer" sur la couche contextuelle du formulaire, si les données sont enregistrées avec succès, la couche contextuelle sera fermée et la page de liste sera actualisée :

<span style="color:#000099;">submitHandler: function (form){  
      $.post(  
        $(&#39;.domain_name&#39;).val()+"/Stat/AddOrUpdateUserCategory.action",  
        $(form).serialize(),  
        function(data){  
          var result = eval("("+data+")");  
          if(!result.status){  
            alert(result.message);  
          }else{  
            //添加数据成功，关闭弹出窗之前，刷新列表页面的数据  
            parent.window.location.href=$(&#39;.domain_name&#39;).val()+"/Stat/QueryUserCategoryListStat.action";  
            </span><span style="color:#ff6666;"> var index = parent.layer.getFrameIndex(window.name); //获取窗口索引  
            parent.layer.close(index); </span><span style="color:#000099;"> 
          }  
        }  
      );  
    } </span>

Copier après la connexion

Recommandations associées :

Explication détaillée de l'utilisation du plug-in ThickBox de la couche contextuelle Jquery

js implémentation de la fermeture du code de fonction de fenêtre de la couche contextuelle js

implémentation jQuery du clic Fermer l'effet de la couche contextuelle à n'importe quelle position en dehors de la couche contextuelle

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!