JQuery/JavaScript在IE7中不起作用_Javascript_Jquery_Asp.net Mvc 3

JQuery/JavaScript在IE7中不起作用

javascript jquery asp.net-mvc-3

JQuery/JavaScript在IE7中不起作用,javascript,jquery,asp.net-mvc-3,Javascript,Jquery,Asp.net Mvc 3,下面的脚本没有在IE7中运行，但在Chrome和Firefox中运行。一旦用户单击“更改密码”，IE中不会发生任何事情 <script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function () { $("#closebtn").

下面的脚本没有在IE7中运行，但在Chrome和Firefox中运行。一旦用户单击“更改密码”，IE中不会发生任何事情

<script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>

<script type="text/javascript">

$(document).ready(function () {
    $("#closebtn").click(function () {
        $("#dlg").hide('800', "swing", function () { $("#bkg").fadeOut("500"); });
    });


    $("#opn").click(function () {
        if (document.getElementById('bkg').style.visibility == 'hidden') {
            document.getElementById('bkg').style.visibility = '';
            $("#bkg").hide();
        }
        if (document.getElementById('dlg').style.visibility == 'hidden') {
            document.getElementById('dlg').style.visibility = '';
            $("#dlg").hide();
        }
        $("#bkg").fadeIn(500, "linear", function () { $("#dlg").show(800, "swing"); });
        return false;
    });

});
</script>


  <div id="Accountdisplay">
    @using (Html.BeginForm("Accountdetail", "Home", FormMethod.Get))
     {

     <table align="left" cellspacing="10" cellpadding="5">
     <tr><td class="editor-label" >
      User Name:
     </td><td>
      @Html.DisplayFor(model => model.UserName)
      </td></tr>
      <tr>
   <td class="editor-label">
   Email Id:
</td>
<td>
  @Html.DisplayFor(model => model.Email_Id)
  </td></tr>
  <tr>
   <td class="editor-label">
  Division:
   </td>
   <td>
   @Html.DisplayFor(model=>model.Division)
</td></tr>
<tr>
<td class="editor-label">
User Type:
</td>
<td>
@Html.DisplayFor(model=>model.User_Type)
</td></tr>
<tr><td>

<a href="#" id="opn" rel="nofollow">Change Password</a>

  @*<div >
   @Html.ActionLink("[Change Password]",null,"Home",new {id="opn",style =    
  "color:white"})
</div>*@
</td></tr>

</table>

}
</div>


<div class="blockbkg" id="bkg" style="visibility: hidden;">
<div class="cont" id="dlg" style="visibility: hidden;">
  <div class="closebtn" title="Close" id="closebtn"></div>
  @using (Html.BeginForm("Logon", "Home", FormMethod.Post))
  {
   <table>
   <tr>
   <td>
    @Html.LabelFor(model => model.Password) 
   </td>
    <td>@Html.TextBoxFor(model => model.UserName, new { Style =         
   "width:65%;height:25px;font-size:1.05em" }) </td>
   </tr>

   <tr>
   <td>
    @Html.LabelFor(model => model.Confirm_Password) 
   </td>
   <td>@Html.TextBoxFor(model => model.Confirm_Password, new { Style = "width:65%;height:25px;font-size:1.05em" }) </td>
   </tr>



   </table>   

  }
 </div>
 </div>

       my css:
          #Accountdisplay 
          {
       background-color:Gray;
         color:Black;
        width:50%;
         border:1px solid black;
        height:80%;
          padding: 20px;
           margin-left:200px;
          margin-top:10px;
            }
          .blockbkg {
           background-color: black;

          background-color: rgba(0,0,0,0.90);
          width: 100%;
          min-height: 100%;
           overflow: hidden;
  position: absolute;
  position: fixed;
  top: 0;
  left: 0;
  color: white;
}
.cont {
  background-color:Green;
  color:White;
  font-size: 16px;
  border: 1px solid gray;
  padding: 20px;
  display:block;
  position: absolute;
  top: 10%;
  left: 35%;


  width: 300px;
  height: 300px;

}
.closebtn 
  {
  width: 20px;
  height: 20px;
  padding: 5px;
  margin: 2px;
  float: right;
  top: 0;

  background-color:Gray;
  display: block;
   }

        .closebtn:hover 
        {
        cursor: pointer;
          }


$（文档）.ready（函数（）{
$（“#closebtn”）。单击（函数（）{
$（“#dlg”）.hide（'800'，“swing”，function（）{$（“#bkg”）.fadeOut（“500”）}）；
});
$（“#opn”）。单击（函数（）{
if（document.getElementById（'bkg'）.style.visibility=='hidden'）{
document.getElementById（'bkg'）.style.visibility=''；
$（“#bkg”）.hide（）；
}
if（document.getElementById（'dlg'）.style.visibility=='hidden'）{
document.getElementById（'dlg'）.style.visibility=''；
$（“#dlg”）.hide（）；
}
$（“#bkg”）.fadeIn（500，“线性”，函数（）{$（“#dlg”）.show（800，“摆动”）；}）；
返回false；
});
});
@使用（Html.BeginForm（“Accountdetail”、“Home”、FormMethod.Get））
{
用户名：
@DisplayFor（model=>model.UserName）
电子邮件Id:
@DisplayFor（model=>model.Email\u Id）
分部：
@DisplayFor（model=>model.Division）
用户类型：
@DisplayFor（model=>model.User\u类型）
@*
@ActionLink（“[Change Password]”，null，“Home”，new{id=“opn”，style=
“颜色：白色”}）
*@
}
@使用（Html.BeginForm（“登录”、“主页”、FormMethod.Post））
{
@LabelFor（model=>model.Password）
@Html.TextBoxFor（model=>model.UserName，新{Style=
“宽度：65%；高度：25px；字体大小：1.05em”}）
@LabelFor（model=>model.Confirm\u密码）
@Html.TextBoxFor（model=>model.Confirm_密码，新{Style=“width:65%；height:25px；font size:1.05em”}）
}
我的css：
#帐户显示
{
背景颜色：灰色；
颜色：黑色；
宽度：50%；
边框：1px纯黑；
身高：80%；
填充：20px；
左边距：200px；
边缘顶部：10px；
}
.blockbkg{
背景色：黑色；
背景色：rgba（0,0,0,0.90）；
宽度：100%；
最小高度：100%；
溢出：隐藏；
位置：绝对位置；
位置：固定；
排名：0；
左：0；
颜色：白色；
}
续{
背景颜色：绿色；
颜色：白色；
字体大小：16px；
边框：1px纯色灰色；
填充：20px；
显示：块；
位置：绝对位置；
排名前10%；
左：35%；
宽度：300px；
高度：300px；
}
.关闭
{
宽度：20px；
高度：20px；
填充物：5px；
保证金：2倍；
浮动：对；
排名：0；
背景颜色：灰色；
显示：块；
}
.closebtn:悬停
{
光标：指针；
}

在这里，我还添加了css。我仍然找不到为什么它不能在IE 7中工作，我要更换IE vesrion并检查吗？？？？

提前谢谢，

对不起。。。我无法添加评论…：/

jquery脚本标记位于哪里？在头部或身体的某个地方？

我看不出到底是什么问题，但这段代码很奇怪，应该更改为完全使用jQuery

$("#opn").click(function () {
    /*
    if (document.getElementById('bkg').style.visibility == 'hidden') {
        document.getElementById('bkg').style.visibility = '';
        $("#bkg").hide();
    }
    if (document.getElementById('dlg').style.visibility == 'hidden') {
        document.getElementById('dlg').style.visibility = '';
        $("#dlg").hide();
    }
    */
    $("#bkg,#dlg").css("visibility", "").hide(); // does the same thing as above

    $("#bkg").fadeIn(500, "linear", function () { $("#dlg").show(800, "swing"); });
    return false;
});

另一方面，除非您确实需要

bgk

和

dlg

在页面加载时具有布局，但不可见，否则应使用

display:none

相反，它是

hide

和

show

用来切换元素可见性的东西（也通过

fadeOut

和

fadeIn

）

有控制台错误吗？也没有控制台错误。@anoop，IE7中的控制台？：-）说到firefox中的控制台，你可以模仿ie9中的ie7。在那里你可以使用控制台。我现在也在firefox和chrome中工作，而不是在IE中。$（文档）。准备（函数（）{$（“#closebtn”）。单击（函数（）{$（“#dlg”）。隐藏（'800'，“swing”，函数（）{$（“#bkg”）。淡出（'500”）；}$（“#opn”）。单击（函数（）{$(“#bkg，#dlg”）.css（“可见性”；”）.hide（）；$（“#bkg”）.fadeIn（'500'，“线性”，函数（）{$（“#dlg”）.show（'800'，“swing”）；return false；}）；“onclick未启动”。$（“#opn”）.单击（函数（）{alert（'clciked（'clciked successfully'）；”）；“@Html.ActionLink，null，“Home”，新的{id=“opn”，style=“color:white”}），如果您执行

警报（$（“#opn”）.length）它输出什么？它应该是1
。如果是，请尝试更改$（“#opn”）。单击$（“#opn”）的（函数（）…
。单击（“单击”，函数（）…
）。