なぜこのスクリプトはマスターページから実行されていませんか？

私はマスターページに関連付けられたページを持っています。マスターページでは、CSSのリンクをheadセクションに置き、jqueryスクリプトタグと関数を含むスクリプトを入れてグリッドを切り替えますが、動かない場合はグリッドを切り替えます。私がアイテムをクリックしたときにshowhideを呼び出すことさえないように見えます。ここでなぜこのスクリプトはマスターページから実行されていませんか？

は、マスターページの抜粋である：ここで

<head runat="server"> 
<title></title> 
<link href="MainLayout.css" rel="stylesheet" type="text/css" /> 
<link href="ajaxtab.css" rel="stylesheet" type="text/css" /> 
<link href="dialog.css" rel="stylesheet" type="text/css" /> 
<link href="grid.css" rel="stylesheet" type="text/css" /> 
<link href="pager.css" rel="stylesheet" type="text/css" /> 
<link href="subgrid.css" rel="stylesheet" type="text/css" /> 
<script src="jquery-1.3.2.min.js" type="text/javascript"></script> 

<script type="text/javascript"> 
     //master: id of div element that contains the information about master data 
     //details: id of div element wrapping the details grid 
     function showhide(master, detail) { 
      //First child of master div is the image 
      var src = $(master).children()[0].src; 
      //Switch image from (+) to (-) or vice versa. 
      if (src.endsWith("plus.png")) 
       src = src.replace('plus.png', 'minus.png'); 
      else 
       src = src.replace('minus.png', 'plus.png'); 

      //Set new image 
      $(master).children()[0].src = src; 

      //Toggle expand/collapse     
      $(detail).slideToggle("normal"); 
     } 
</script> 
<asp:ContentPlaceHolder ID="head" runat="server"> 

</asp:ContentPlaceHolder> 
</head>

はaspxページ内のonclickイベントにshowhide機能が含まれているdiv要素である：ここでは

<div class="searchgroup" 
id='<%#String.Format("master{0}",Container.DataItemIndex)%>' 
onclick='showhide(<%#String.Format("\"#master{0}\"",Container.DataItemIndex)%> 
, 
<%#String.Format("\"#detail{0}\"",Container.DataItemIndex) %>)'> 
<asp:Image ID="imgCollapsible" 
      CssClass="first" 
      ImageUrl="plus.png" 
      Style="margin-right: 5px;" 
      runat="server" /> 

<span class="searchheader"><%#Eval("Business")%></span> 
</div>

は、それが生成するHTMLですマスターとディテールのdivのために：

//master div 
<div class="searchgroup" 
    id='master0'              
    onclick='showhide("#master0","#detail0")'> 

<img id="ctl00_ContentPanel_gvMaster_ctl02_imgCollapsible" 
    class="first" src="plus.png" 
    style="border-width:0px;margin-right: 5px;" /> 
    <span class="searchheader">ABC</span> 
</div> 

//details div 
<div id='detail0' class="searchdetail"> 
<div> 
<table class="searchgrid" 
     id="ctl00_ContentPanel_gvMaster_ctl02_gvDtails"> 
<tr> 
<th>Status</th> 
<tr class="searchrow"> 
<td>2</td> 
</tr> 
</table> 
</div> 
</div>

私はjQueryの作業を得ることができませんでしたし、私はrunnました時間の余裕がないので、私はajaxコントロールツールキットから折りたたみ可能なパネルの外部を使用することに決めました。私が時間を取ると、私はJQueryの問題を調査します。これまでのすべての提案に感謝します。誰かがそれ以上持っているなら、私に知らせてください。

出典

2009-03-25 Xaisoft

（それはJSファイルをCSSの細かい動作しますが、ではない）あなたはマスターページ上のJavaScript URLを解決する必要が私に語りましたショーハイドに。実際のコードを扱うときに識別するのがずっと速いものがあります。 – eglasius

私の考えは正確に - レンダリングされたhtmlを表示し、まだ立ち往生している場合は、htmlの関連部分を含むようにあなたの投稿を編集します。 –

jsにはendsWith関数が組み込まれていないため、javascriptでsrc.endsWith（ "plus.png"）にエラーが発生しています。 src.substrであることを置き換える（-8）==ではなく "plus.png" とそれが動作します：

<script type="text/javascript"> 
     //master: id of div element that contains the information about master data 
     //details: id of div element wrapping the details grid 
     function showhide(master, detail) { 
      //First child of master div is the image 
      var src = $(master).children()[0].src; 
      //Switch image from (+) to (-) or vice versa. 
      if (src.substr(-8) == "plus.png") 
       src = src.replace('plus.png', 'minus.png'); 
      else 
       src = src.replace('minus.png', 'plus.png'); 

      //Set new image 
      $(master).children()[0].src = src; 

      //Toggle expand/collapse     
      $(detail).slideToggle("normal"); 
     } 
</script>

EDIT - 作業例：

MasterPage.master

<%@ Master Language="C#" AutoEventWireup="true" %> 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title>Untitled Page</title> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
    <script type="text/javascript"> 
      //master: id of div element that contains the information about master data 
      //details: id of div element wrapping the details grid 
      function showhide(master, detail) { 
       //First child of master div is the image 
       var src = $(master).children()[0].src; 
       //Switch image from (+) to (-) or vice versa. 
       if (src.substr(-8) == "plus.png") 
        src = src.replace('plus.png', 'minus.png'); 
       else 
        src = src.replace('minus.png', 'plus.png'); 

       //Set new image 
       $(master).children()[0].src = src; 

       //Toggle expand/collapse     
       $(detail).slideToggle("normal"); 
      } 
    </script> 

    <asp:ContentPlaceHolder id="head" runat="server"> 
    </asp:ContentPlaceHolder> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 
     <asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server"> 

     </asp:ContentPlaceHolder> 
    </div> 
    </form> 
</body> 
</html>

Default2.aspx

<%@ Page Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" Title="Untitled Page" %> 

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server"> 
</asp:Content> 
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server"> 
    <div class="searchgroup" id='master0' onclick='showhide("#master0","#detail0")'> 

    <img id="ctl00_ContentPanel_gvMaster_ctl02_imgCollapsible" class="first" src="plus.png" style="border-width:0px;margin-right: 5px;" /> 
    <span class="searchheader">ABC</span> 
    </div> 

    <div id='detail0' class="searchdetail"> 
     <div> 
      <table class="searchgrid" 
       id="ctl00_ContentPanel_gvMaster_ctl02_gvDtails"> 
       <tr> 
        <th>Status</th> 
       </tr> 
       <tr class="searchrow"> 
        <td>2</td> 
       </tr> 
      </table> 
     </div> 
    </div> 
</asp:Content>

出典

2009-03-25 17:28:53 Adam

マスターページを使用していないと、どうしてこのエラーが発生しないのですか？スクリプトをマスターページのheadセクションに置くと、showhide関数は起動せず、Firebugでブレークポイントを設定すると、すべてが定義されていません。 – Xaisoft

JQueryにendsWidth関数がありますか？ – Xaisoft

@ xaisoft、あなたがなぜそれを得られなかったのか分かりません。私のためにff3にスローします "src.endsWithは関数ではありません" Line：17 – Adam

「アイテムをクリックしたときにshowhideを呼び出していないように見えます。」 alert（）関数だけで関数を単純化すると、それは機能します。

コードはわかりやすく表示されます。たぶん、いくつかのIDの不一致があります。

出典

2009-03-25 15:30:11

私はalert（ "hello"）; showhide（マスター、ディテール）機能ではうまく動作します。 – Xaisoft

オリジナルのステートメントは、「アイテムをクリックしたときにshowhideを呼び出していないようです。正しいものではありません。 Jquery select文で正しいオブジェクトが選択されていない可能性があります。続行する前にselectオブジェクトの戻り値を確認してください。 –

どのように私は、JavaScriptをデバッグすることができます、私はブレークポイントを置くことはできません。私はVS 2008で働いています – Xaisoft

jqueryのパスが、このマスターページを使用するページで正しいかどうかを確認することができます。

FirefoxでFirebugを使用することができるかどうかを確認するには、関数内のブレークポイントを使用します。

また、デバッグして何がうまくいかないのかを推測する手がかりも与えられます。

コードは私にとっても良いようです。

出典

2009-03-25 15:48:17 eKek0

このコードは、マスターページのないページでテストしたときに機能しますが、マスターページに入れても機能しません。パスは正しいです。マスターではなく、ページ自体にスクリプトを直接配置することはできますか。 – Xaisoft

ブラウザでビューソースを右クリックすると、jQueryパスが正しく表示されますか？私の経験では、それを少しデバッグしよう生成されたHTMLソースを確認し、それを取得してください@Xaisoft

<script src="<%= ResolveUrl("~") %>jquery-1.3.2.min.js" type="text/javascript"></script>

出典

2009-06-03 06:30:43 Ayyash

なぜこのスクリプトはマスターページから実行されていませんか？

答えて

関連する問題