8

これと同様の問題と回答を見てきましたが、問題を解決しているようには見えません。

更新パネル内にユーザー コントロールがあります。ユーザー コントロール内で、javascript を出力します。

トリガーされたときにJavaScriptは起動しません。javascript を usercontrol/updatepanels の外の親ページに移動すると、起動します。コードを複製せずにこのユーザーコントロールを別のページで使用できないため、これを行う意味がありません... javascript全体（別のサイト）を複製するか、使用されるすべてのページで.jsファイルへの参照を追加しますに（同サイト）。携帯性が悪いだけ

コントロール（更新パネル内）でJavaScriptを出力したいだけです。

updatepanel は、私がやっていることの正確さのために言及されています。ユーザーコントロールを updatepanels の外に配置しても機能しません。

シンプルに保つ（これは私にはうまくいきません）：

ユーザーコントロール:

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="_location.ascx.cs" Inherits="_location" %>
<script type="text/javascript">
    function test() {
        alert('Hello World!');
    }
</script>

<a href="javascript:void(0);" onclick="javascript:test();">
    Find For Me
</a>

親：

<uc1:_location runat="server" ID="_location"  />

Chrome でデバッグすると、「Uncaught ReferenceError: test is not defined」と表示される

以下のように onclick に JavaScript を直接追加すると、動作します。

onclick="alert('Hello World!');"

上記のように、関数を親ページに移動することも機能します。

ブラウザがユーザー コントロールからのスクリプト出力を無視するかのようです。

何か案は？

4

5 に答える 5

1

私を正しい道に導いてくれたAristosに感謝します...彼の解決策は機能しますが、ユーザーコントロール内からjavascriptを出力するという質問には答えませんでしたが、代わりに外部に移動することを提案しました。前述のように、移植性を高めるためにコントロール内に保持されていないため、これは望ましい結果ではありませんでした。

これを実現する私のソリューションは次のとおりです: CS ファイル:

String script = "<script type=\"text/javascript\">";
script += "function test() {";
    script += "alert('Hello World!');";
script += "</script>";

Page.ClientScript.RegisterClientScriptBlock(Page.GetType(), "locationScript", script);

スクリプトが長い場合は stringbuilder を使用できますが、どちらでも機能します。

これにより、コード全体がユーザーコントロール内に保持され、タグの onclick イベントから機能します。

于 2013-04-13T15:12:51.103 に答える
-1

内部の DOM 要素にバインドされている JavaScript コードを処理する好ましい方法は、PageRequestManagerのイベントにUpdatePanelサブスクライブし、ここでコードを実行することです。たとえば、ここでクリック イベント ハンドラーを設定します。endRequest

// that is standard way for asp.net to execute JS on page load
// pretty much the same as $(function(){ ...}) with jquery
function pageLoad() {
    // find PRM instance and subscribe to endRequest
    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(endRequest);
}

function endRequest() {
    // set all handlers to DOM elements that are within UpdatePanel
    $('<%= myButton.ClientID %>').on('click', test)
}

function test(e) {
   alert('Hi')
}

別の解決策は、次のようにイベント委任を使用することです。

function pageLoad() {

    // delegate click event on .myButton inside .container
    // to the .container DOM element
    $('.container').on('click', '.myButton', test)

}

そして、更新パネルの周りに名前がdiv付けられたクラスを持っています。containerこの場合、 yourdiv.containerは DOM から削除されないため、その上のすべてのイベント ハンドラーは部分的なポストバック後も保持されます。

jquery を使用せず、asp.net ajax のみを使用する同じコードは、次のようになります。

function pageLoad() {
   Sys.UI.DomEvent.addHandler($("myContainer"), "click", delegatedTest);
}

function delegatedTest(e) {
   // since asp.net ajax does not support event delegation
   // you need to check target of the event to be the right button 
   if (e.target.id == "myButton") test(e)
}

function test(e) {
   alert("HI")
}
于 2013-04-13T14:27:38.990 に答える