-1

解決策 2012 年 8 月 9 日 9:54 EDT
恥ずかしいことですが、ブラウザの設定に問題があることを突き止めることができました。アクティブなスクリプトが無効になりました。投稿してくれたみんなに感謝します。あなたの時間と労力に感謝します。~~~~~~~~~~~~~~~~~~~~~~~~~~

最近、新しい MVC3 アプリケーションを開始し、jQuery 1.7.2 を使用しています。現在、コードは Chrome、Firefox、IE7 & 9 で動作します。残念ながら、IE8 では動作しません。使用しようとしている jQuery 関数 (mouseover、mouseout、hover、click など) は関係ありません。

これまでのところ、運が悪くても次のことを試しました。

  • jQueryおよびjsファイルへの絶対パス参照の使用
  • js コードを _Layout.cshtml に直接移動する
  • type="text/javascript" を確認
  • コードを Alert("any text"); だけに減らします。別のブラウザで検証する
  • 背景色を追加
  • 「Menu.js」への参照を削除して、Shared.js の非常に単純なコードが機能するかどうかをテストします

_ActionItems 部分ビューで .hover アクションを動作させようとしています。このための jQuery は Menu.js にあります。私がそれを機能させることができれば、残りはおそらく私が理解できる同様の解決策を持っていると思いました.

他に確認する必要がある場合は、お知らせください。助けてくれてありがとう。

_Layout.cshtml

@using eRecruitBoard.ExtensionMethods
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <title>@ViewBag.Title</title>
    <link href='http://fonts.googleapis.com/css?family=Droid+Serif:400,700,400italic' rel='stylesheet' type='text/css'/>
    <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
    <script src="@Url.Content("~/Scripts/jquery-1.7.2.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/Shared.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/Menu.js")" type="text/javascript"></script>
</head>
<body>
    <div class="wrapper">
            <div class="aboveHeader">
                <div class="aboveHeaderLeft">@Html.Partial("_ERBLogo")</div>

                <div class="aboveHeaderRight">
                    <div class="ERBESBButtons">@Html.Partial("_ERBESBButtons")</div>
                    <div class="welcome">@Html.Partial("_Welcome")</div>
                </div>
            </div>
            <div class="headerBar">
                <div class="headerActions">@Html.Partial("_ActionItems")</div>
                <div class="headerMenu">@Html.Action("Menu", "Menu")</div>
                <div class="headerTitle">@Html.Action("HeaderTitle","Segment")</div>
            </div>
        <div class="content">
            @RenderBody()
        </div>
        <div class="Push"></div>
  </div>  
    <div class="footerWrapper">
        <div class="footer">
            <div class="footerLeft"></div>
            <div class="footerRight"></div>
            <div class="footerRightContent">@Html.ActionLink("Privacy Policy", "PrivacyPolicy", "Home")</div>
            <div class="footerLeftContent">&copy; Copyright 2012 - All Rights Reserved</div>
        </div>
    </div>
</body>
</html>

_ActionItems.cshtml

@if (eRecruitBoard.WebLibrary.CommonFunctions.IsAuthenticated)
{
@Html.ImageActionLink("../../Images/Header/FavoriteIcon.png", "FavoritesIcon", "Add", "Favorites", null, null, new { @class = "over", title="Add to favorites", style="border:0;" })<text>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</text>
<img src="../../Images/Header/CalendarIcon.png" title="Schedule this report" alt="CalendarIcon" class="over"/><text>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</text>
<img src="../../Images/Header/EmailIcon.png" title="Email this report" alt="EmailIcon" class="over"/><text>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</text>
<img src="../../Images/Header/PrintIcon.png" title="Print" alt="PrintIcon" class="over"/>
}
else
{ 
}

Shared.js

// Hover image
$(document).ready(function () {
    $(function () {
        $("img.over").each(function () {
            var t = $(this);
            var src1 = t.attr("src"); // initial src
            var newSrc = src1.substring(0, src1.lastIndexOf(".")); // let's get file name without extension
            t.hover(function () {
                $(this).attr("src", newSrc + "Over." + /[^.]+$/.exec(src1)); //last part is for extension   
            }, function () {
                $(this).attr("src", newSrc + "." + /[^.]+$/.exec(src1)); //removing 'Over' from the name
            });
        });
    });
});

更新- ブラウザのソースを追加できるように、menu.js コードを削除しました。今のところ、Shared.js コードに焦点を当てています。これは非常にシンプルで、Menu.js が完全に削除されても何も起こらないからです。

ブラウザー ソースのサンプル- これは、jQuery をページに直接移動してアラートを追加したテストの 1 つです。とにかく、これもうまくいきません。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <title>eRecruitBoard</title>

    <link href='http://fonts.googleapis.com/css?family=Droid+Serif:400,700,400italic' rel='stylesheet' type='text/css'/>
    <link href="/Content/Site.css" rel="stylesheet" type="text/css" />
    <script src="/Scripts/jquery-1.7.2.js" type="text/javascript"></script>

    <script type="text/javascript"> 
// Hover image
$(document).ready(function () {
    $(function () {
$("#container").hover('',function(){ 
alert("Out"); 
});
    });
});


$(document).ready(function () {
    $(function () {
        $("img.over").each(function () {
            var t = $(this);
            var src1 = t.attr("src"); // initial src
            var newSrc = src1.substring(0, src1.lastIndexOf(".")); // let's get file name without extension
            t.hover(function () {
                $(this).attr("src", newSrc + "Over." + /[^.]+$/.exec(src1)); //last part is for extension   
            }, function () {
                $(this).attr("src", newSrc + "." + /[^.]+$/.exec(src1)); //removing 'Over' from the name
            });
        });
    });
});
</script>
</head>
<body>
    <div class="wrapper">

            <div class="aboveHeader">
                <div class="aboveHeaderLeft"><a href="/"><img alt="eRecruitBoard" src="../../Images/eRecruitBoardLogo.png" style="border:0;" /></a></div>

                <div class="aboveHeaderRight">
                    <div class="ERBESBButtons"><img src="../../Images/Header/ERBOn.png" alt="eRecruitBoard On"/><img src="../../Images/Header/ESBOff.png" alt="eScoreBoard Off"/>
</div>
                    <div class="welcome">Welcome Firstname Lastname&nbsp;&nbsp;&nbsp; 
<a href="/Admin/MyTeam">Admin</a>&nbsp;|&nbsp;
<a href="/Home/Logout">Logout</a></div>
                </div>
            </div>

            <div class="headerBar">
                <div class="headerActions"><a href="/Favorites/Add"><img alt="FavoritesIcon" class="over" src="../../Images/Header/FavoriteIcon.png" style="border:0;" title="Add to favorites" /></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<img src="../../Images/Header/CalendarIcon.png" title="Schedule this report" alt="CalendarIcon" class="over"/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<img src="../../Images/Header/EmailIcon.png" title="Email this report" alt="EmailIcon" class="over"/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<img id="container" src="../../Images/Header/PrintIcon.png" title="Print" alt="PrintIcon" class="over"/>
</div>
                <div class="headerMenu"><img src="../../Images/Header/MenuIcon.png" id="MenuIcon" title="Click to open the menu" alt="MenuIcon" class="over"/>
<table class="menuTable" id="menuTableId"  cellspacing="0" cellpadding="0">
<thead>
<tr class="scrollUpArrow">
<th>
</th>
</tr>
</thead>

<tfoot>
<tr class="scrollDownArrow">
<td>
</td>
</tr>
</tfoot>

 <tbody id="contents" class="tablebody" style="overflow:hidden">
    <tr class="trmenuClass" id=favoritestrId>
    <td class="cellBackground">
    <div class="minusSign" id=favoritesMinusSignId>  
    <div class=favIcon id=divFavoritesid>
    <div class="cellName">

    Favorites
    </div>
    </div>
    </div>
    </td>
    </tr>
    <tr class="favtrClass" id="submenufavouritestrId">
    <td class="subMenuCell" id="idFavorites">
    <div class="subMenuCellName">
    1st name
    </div>
    </td>
    </tr>
    <tr class="favtrClass" id="submenufavouritestrId">
    <td class="subMenuCell" id="idFavorites">
    <div class="subMenuCellName">
    2nd name
    </div>
    </td>
    </tr>
    <tr class="favtrClass" id="submenufavouritestrId">
    <td class="subMenuCell" id="idFavorites">
    <div class="subMenuCellName">
    3rd name
    </div>
    </td>
    </tr>
    <tr class="trmenuClass" id=dashboardtrId>
    <td class="cellBackground">
    <div class="minusSign" id=dashboardMinusSignId>  
    <div class=dashboardIcon id=divDashBoardid>
    <div class="cellName">

    Dashboard
    </div>
    </div>
    </div>
    </td>
    </tr>
    <tr class="dashboardtrClass" id="submenudashboardtrId">
    <td class="subMenuCell" id="idDashboard">
    <div class="subMenuCellName">
    Dashboard Item 1
    </div>
    </td>
    </tr>
    <tr class="dashboardtrClass" id="submenudashboardtrId">
    <td class="subMenuCell" id="idDashboard">
    <div class="subMenuCellName">
    Dashboard Item 2
    </div>
    </td>
    </tr>
    <tr class="dashboardtrClass" id="submenudashboardtrId">
    <td class="subMenuCell" id="idDashboard">
    <div class="subMenuCellName">
    Dashboard Item 3
    </div>
    </td>
    </tr>
    <tr class="trmenuClass" id=connecttrId>
    <td class="cellBackground">
    <div class="minusSign" id=connectMinusSignId>  
    <div class=connectIcon id=divConnectid>
    <div class="cellName">

    Connect
    </div>
    </div>
    </div>
    </td>
    </tr>
    <tr class="connecttrClass" id="submenuconnecttrId">
    <td class="subMenuCell" id="idConnect">
    <div class="subMenuCellName">
    Joe Smith
    </div>
    </td>
    </tr>
    <tr class="connecttrClass" id="submenuconnecttrId">
    <td class="subMenuCell" id="idConnect">
    <div class="subMenuCellName">
    Erin Jones
    </div>
    </td>
    </tr>
    <tr class="connecttrClass" id="submenuconnecttrId">
    <td class="subMenuCell" id="idConnect">
    <div class="subMenuCellName">
    Owen Alexander
    </div>
    </td>
    </tr>
    <tr class="trmenuClass" id=hiretrId>
    <td class="cellBackground">
    <div class="minusSign" id=hireMinusSignId>  
    <div class=hireIcon id=divHireid>
    <div class="cellName">

    Hire
    </div>
    </div>
    </div>
    </td>
    </tr>
    <tr class="hiretrClass" id="submenuhiretrId">
    <td class="subMenuCell" id="idHire" >
    <div class="subMenuCellName">
    Clair Brown
    </div>  
    </td>
    </tr>
    <tr class="trmenuClass" id=retaintrId>
    <td class="cellBackground">
    <div class="minusSign" id=retainMinusSignId>  
    <div class=retainIcon id=divRetainid>
    <div class="cellName">

    Retain
    </div>
    </div>
    </div>
    </td>
    </tr>
    <tr class="retaintrClass" id="submenuretaintrId">
    <td class="subMenuCell" id="idRetain">
    <div class="subMenuCellName">
    some good employee name
    </div>
    </td>
    </tr>
    <tr class="trmenuClass" id=activityreportstrId>
    <td class="cellBackground">
    <div class="minusSign" id=activityreportsMinusSignId>  
    <div class=activityIcon id=divActivityReportsid>
    <div class="cellName">

    Activity Reports
    </div>
    </div>
    </div>
    </td>
    </tr>
    <tr class="activityreportstrClass" id="submenuactivityreportstrId">
    <td class="subMenuCell" id="idActivityReports">
    <div class="subMenuCellName">
    Activity report 1
    </div>
    </td>
    </tr>
    <tr class="activityreportstrClass" id="submenuactivityreportstrId">
    <td class="subMenuCell" id="idActivityReports">
    <div class="subMenuCellName">
    Activity report 2
    </div>
    </td>
    </tr>
    <tr class="activityreportstrClass" id="submenuactivityreportstrId">
    <td class="subMenuCell" id="idActivityReports">
    <div class="subMenuCellName">
    Activity report 3
    </div>
    </td>
    </tr>
    <tr class="activityreportstrClass" id="submenuactivityreportstrId">
    <td class="subMenuCell" id="idActivityReports">
    <div class="subMenuCellName">
    Activity report 4
    </div>
    </td>
    </tr>
    <tr class="activityreportstrClass" id="submenuactivityreportstrId">
    <td class="subMenuCell" id="idActivityReports">
    <div class="subMenuCellName">
    Activity report 5
    </div>
    </td>
    </tr>
    <tr class="activityreportstrClass" id="submenuactivityreportstrId">
    <td class="subMenuCell" id="idActivityReports">
    <div class="subMenuCellName">
    Activity report 6
    </div>
    </td>
    </tr>
    <tr class="activityreportstrClass" id="submenuactivityreportstrId">
    <td class="subMenuCell" id="idActivityReports">
    <div class="subMenuCellName">
    Activity report 7
    </div>
    </td>
    </tr>
    <tr class="activityreportstrClass" id="submenuactivityreportstrId">
    <td class="subMenuCell" id="idActivityReports">
    <div class="subMenuCellName">
    Activity report 8
    </div>
    </td>
    </tr>
    <tr class="activityreportstrClass" id="submenuactivityreportstrId">
    <td class="subMenuCell" id="idActivityReports">
    <div class="subMenuCellName">
    Activity report 9
    </div>
    </td>
    </tr>
    <tr class="activityreportstrClass" id="submenuactivityreportstrId">
    <td class="subMenuCell" id="idActivityReports">
    <div class="subMenuCellName">
    Activity report 10
    </div>
    </td>
    </tr>
    <tr class="activityreportstrClass" id="submenuactivityreportstrId">
    <td class="subMenuCell" id="idActivityReports">
    <div class="subMenuCellName">
    Activity report 11
    </div>
    </td>
    </tr>
    <tr class="activityreportstrClass" id="submenuactivityreportstrId">
    <td class="subMenuCell" id="idActivityReports">
    <div class="subMenuCellName">
    Activity report 12
    </div>
    </td>
    </tr>

</tbody>


</table>
</div>
                <div class="headerTitle"><img src="../../Images/Header/TitleArrow.png" alt="Arrow" style="vertical-align:top;"/>
<ul class="segmentControl">
</ul>
</div>
            </div>



        <div class="content">

<h2>Homepage</h2> - <a href="/Dashboard/All">Link to Dashboard/All</a>
        </div>
        <div class="Push"></div>
  </div>  

    <div class="footerWrapper">
        <div class="footer">
            <div class="footerLeft"></div>
            <div class="footerRight"></div>
            <div class="footerRightContent"><a href="/Home/PrivacyPolicy">Privacy Policy</a></div>
            <div class="footerLeftContent">&copy; Copyright 2012 - All Rights Reserved</div>
        </div>
    </div>
</body>
</html>
4

3 に答える 3

1

恥ずかしいことに、ブラウザの設定に問題を突き止めることができました. アクティブなスクリプトが無効になりました。

[ツール] > [インターネット オプション] > [セキュリティ] > [レベルのカスタマイズ] ボタンをクリック > [スクリプト] まで下にスクロール > [アクティブ スクリプト]

投稿してくれたみんなに感謝します。あなたの時間と労力に感謝します。

于 2012-08-14T21:37:03.237 に答える
0

次のことを試してください。

$(function () {
    $("#container").hover('',function(){ 
        alert("Out"); 
    });
    $("img.over").each(function () {
        var t = $(this),
            src1 = t.attr("src"),
            newSrc = src1.substring(0, src1.lastIndexOf("."));
        t.hover(function () {
            $(this).attr("src", newSrc + "Over." + /[^.]+$/.exec(src1));
        }, function () {
            $(this).attr("src", newSrc + "." + /[^.]+$/.exec(src1));
        });
    });
});
于 2012-08-09T13:07:41.787 に答える
0

ここで注意すべきことの 1 つは、これらの行で document.ready を 2 回実行していることです。

$(document).ready(function () {
$(function () { // this line does the same as $(document).ready(function () {
于 2012-08-09T13:20:05.780 に答える