자바 스크립트 @ Html.ActionLink

Question

에서 호출되지 않는 나는 다음과 같은 자바 스크립트 test.js 파일이 : 나는 페이지의 "bandRows"사업부에 일부 HTML을 주입 할 때 사용할

$("#addItem").click(function() { 
    alert("yup"); 
    $.ajax({ 
     url: this.href, 
     cache: false, 
     success: function (html) { $("#bandRows").append(html); } 
    }); 
    return false; 
}); 

. 그래서 같은 MVC 3 응용 프로그램에서 면도기를 사용하고 있습니다 :

, 클릭하면 부분보기 HTML 주입하는 링크가 포함 된 인덱스보기 : 순간

@model IEnumerable<TariffBand> 

     <script type="text/javascript" src="=@Url.Content("~/Scripts/jquery-1.3.2.js")"></script> 
     <script type="text/javascript" src="=@Url.Content("~/Scripts/MicrosoftAjax.js")"></script> 
     <script type="text/javascript" src="=@Url.Content("~/Scripts/test.js")"></script> 

    <h2>Index</h2> 

    @using (Html.BeginForm()) 
    { 
    <div id="bandRows"> 
     @foreach (var band in Model) 
     { 
      Html.RenderPartial("BandEditorRow", band); 
     } 
    </div> 

    @Html.ActionLink("Add band...", "Add", null, new { id = "addItem" }) 

    <input type="submit" value = "Done" /> 

을 때 자바 스크립트가 호출되지 않는 링크를 클릭하십시오 - 경고 상자가 표시되지 않고 링크가 'bandRows'div에 삽입하는 대신 'Add'부분보기로 이동합니다.

아무도 말해 줄 수 있습니까? 전에는 javascript를 사용하지 않았기 때문에 분명히 뭔가 어리석은 일을 해왔지만 나 자신의 삶을 위해 그것을 해결할 수는 없습니다.

EDIT - 처리기가 click onclick이 아니도록 .js 파일을 수정했습니다. 나는 또한 html 도우미를 수정하려고 시도했다 :

@Html.ActionLink("add band...", "Add", null, new { onclick = "addItem" } 그러나 여전히 주사위가 없다.

감사 데이비드

Answer 1

당신은 $.onclick 어디에도 없습니다

$("#addItem").onclick(function() 

있습니다.

이

$("#addItem").click(function() 

편집

$().ajax({이 $.ajax({

해야 할 것이다 전체 코드는 document.ready()

$(document).ready(function(){ 
    $("#addItem").click(function(){ 
    . 
    . 
    . 
}); 

같은 편집 이내 일 것 - 2

당신은 내가 세부 코드를 제공하고, 자바 스크립트 세계에 아주 새로운 것을 인정했듯이

:

<script type="text/javascript" src="=@Url.Content("~/Scripts/MicrosoftAjax.js")"></script> 
@* <script type="text/javascript" src="=@Url.Content("~/Scripts/test.js")"></script> *@ 

<h2>Index</h2> 

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $("#addItem").click(function(){ 
      alert("yup"); 
      $.ajax({ 
       url: this.href, 
       cache: false, 
       success: function (html) { 
        $("#bandRows").append(html); 
       } 
      }); 
      return false; 
     }; 
    }); 
</script> 

document ready는 jQuery를 시작할 때 배울 필요가 매우 예비적인 일이다. This은 ready 이벤트의 API 문서입니다. here은 document ready을 이해하는 데 필요한 자습서입니다.