猿问

js弹出框问题,请js比较熟的热帮忙看一下

原js;(这种状况程序不能重复调用利用率比较低)

<script type="text/javascript" src="js/jquery.min.js"></script>

<script type="text/javascript">

var w,h,className;

function getSrceenWH(){

w = $(window).width();

h = $(window).height();

$('#dialogBg').width(w).height(h);

}


window.onresize = function(){  

getSrceenWH();

}  

$(window).resize();  


$(function(){

getSrceenWH();

//显示弹框

$('.box a').click(function(){

className = $(this).attr('class');

$('#dialogBg').fadeIn(300);

//这条语句导致只能调用#dialog这一个div,而我想重复利用这个函数

$('#dialog').removeAttr('class').addClass('animated '+className+'').fadeIn();     

});

//关闭弹窗

$('.claseDialogBtn').click(function(){

$('#dialogBg').fadeOut(300,function(){

$('#dialog').addClass('bounceOutUp').fadeOut();

});

});

});

</script>

更改版:

<script type="text/javascript" src="js/jquery.min.js"></script>

<script type="text/javascript">

var w,h,className;

function getSrceenWH(){

w = $(window).width();

h = $(window).height();

$('#dialogBg').width(w).height(h);

}


window.onresize = function(){  

getSrceenWH();

}  

$(window).resize();  

//我将显示弹框这个函数加了一个参数,然而改动之后,点击登录,弹窗不再显示,那么我错在哪了?虚心求教

function openwindow(content){{

getSrceenWH();

//显示弹框

function(){

className = $(this).attr('class');

var popDiv=document.getElementById(content);

$('#dialogBg').fadeIn(300);

popDiv.style.removeAttr('class').addClass('animated '+className+'').fadeIn();

};

//关闭弹窗

$('.claseDialogBtn').click(function(){

$('#dialogBg').fadeOut(300,function(){

popDiv.style.addClass('bounceOutUp').fadeOut();

});

});

};

</script>

HTML代码:

<div class="box"><p id="user-top-login" class="pull-right top-has-login">

<a  href="javascript:;" onclick="openwindow('dialog');" class="bounceIn">  登录</a> <strong>/</strong>

<a  href="javascript:;" onclick="" class="bounceInDown">  注册</a>

</p>

<!--弹出框-->

<div id="dialogBg"></div>

   <div id="dialog" class="animated">

<img class="dialogIco" width="50" height="50" src="images/ico.png" alt="" />

<div class="dialogTop">

<a href="javascript:;" class="claseDialogBtn">关闭</a>

</div>

<form action="" method="post" id="editForm">

<ul class="editInfos">

<li><label><font color="#ff0000">* </font>用户名:<input type="text" name="" required value="" class="ipt" placeholder="邮箱或手机号"/></label></li>

<li><label><font color="#ff0000">* </font>密&nbsp;&nbsp;&nbsp;码:<input type="text" name="" required value="" class="ipt" placeholder="账户密码"/></label></li>

<li><input type="submit" value="确认提交" class="submitBtn" /></li>

</ul>

</form>

</div></div><!--弹出框结束-->


罗小葭
浏览 2612回答 2
2回答

Mefa

这句:popDiv.style.removeAttr('class').addClass('animated '+className+'').fadeIn();popDiv.removeAttr('class').addClass('animated '+className+'').fadeIn();

Mefa

function openwindow(content){{getSrceenWH();//显示弹框function(){这里格式不对,还有显示弹框方法名呢哪去了
随时随地看视频慕课网APP
我要回答