ファイル内のjQueryの共通機能

私はC＃.NET MVC3 Webアプリケーションを使用しています。私はいくつかの共通jQuery機能を自分のページに持ち、モジュール化したいと考えています。私はこれをする方法を知らない。以下は私が使用しているコードの例です。いくつかのコントロールには、イベントに割り当てられた機能があります。私が持っている各ビューはこれを行いますが、コントロール（およびコントロールの数）は異なります。イベントが追加または1つの.jsファイルにこれを置く方法任意のアイデア10ファイル内のjQueryの共通機能

$(document).ready(function() { 
    $('.datepicker').datepicker({ dateFormat: "mm/dd/yy", minDate: "12/27/2011" }); 

    $("#Description").keyup(function() { 
     enableSaveAlert(); 
    }); 
    $("#DueDate").change(function() { 
     enableSaveAlert(); 
    }); 
    $("#DueDate").keyup(function() { 
     enableSaveAlert(); 
    }); 
}); 


    function enableSaveAlert() { 
     document.title = document.title.replace("*", ""); 
     document.title = document.title + "*"; 
     return true; 
    }

があるかもしれません必要が1つの制御があるかもしれませんか？

出典

2011-12-05 MikeTWebb

このコードはどのように1つの.jsファイルにはありませんか？投稿したサンプルを各ビューファイルにコピーして貼り付けたことはありますか？ –

@Terminal ...はい、そのコードはそれぞれのビューにあります – MikeTWebb

入力要素ごとにIdセレクタを持つのではなく、enableSaveAlert()関数を呼び出す必要があるすべての要素にクラスを配置してみませんか？

だからあなたのHTMLにあなたはそのクラスを経由して、一度あなたのイベントを添付し、あなたのJSに続いて

<input type="text" name="Description" class="save-alert" /> 
<input type="text" name="DueDate" class="save-alert" /> 
<input type="text" name="OtherField" />

を持っていると思います：

$(document).ready(function() { 
    $('.datepicker').datepicker({ dateFormat: "mm/dd/yy", minDate: "12/27/2011" }); 

    $(".save-alert").bind("change keyup", function() { 
     enableSaveAlert(); 
    }); 
}); 

function enableSaveAlert() { 
    document.title = document.title.replace("*", ""); 
    document.title = document.title + "*"; 
    return true; 
}

出典

2011-12-05 14:17:40

@Rory ....個々のコントロールにはすでに独自のクラスがあります。だから、彼らは別々にする必要があります。そして1つの質問ですが、このコードは.jsファイルには入っていませんか？ $（ "。save-alert"）。bind（ "change keyup"、function（）{enableSaveAlert（）;}）; – MikeTWebb

各コントロールに新しいクラスを追加できませんか？そしてあなたはそれがJSでなければならないということです - それはタイプミスでした:) –

@Rory ...どういう意味ですか...コントロールは1つのクラスしか持てませんか？私は理解していません – MikeTWebb

を私はと呼ばれる一つのファイルにあなたの$(document).ready機能を置くことをお勧めmain.jsを開き、テンプレートビューの先頭にそのファイルを含めます。

だからあなたのインデックスやレイアウトテンプレートビューであなたが持っていると思います：

<html> 
    <head> 
     <script src="@Url.Content("~/Scripts/main.js")" type="text/javascript"></script> 
    </head> 
...

を私はそれがの.jsよく組織化ファイルで、決して個々のビューのいずれかですべてのJavaScriptを保つために、常に良いアイデアだと思います。

出典

2011-12-05 15:28:34

@Terminal ....良いアイデア... thx – MikeTWebb

ファイル内のjQueryの共通機能

答えて

関連する問題