2016-09-02 3 views
0

에서 foreach 루프에 존재하고 나는 어떤 항목의 foreach에 대한 사업부을 클릭합니다 ...하지만 .. 저를 도와주세요 ... 작동하지 않았다나는 HTML에서 foreach는이 HTML

및 jQuery를 스크립트로

foreach (KarosazWeb.Models.HeaderItem img in Model.headerslider2) { 

<div class="about-item scrollpoint sp-effect2" id="subjectClick" style="border: 1px solid #b3b3b3;border-color:#73d0d6;border-width:3px;border-radius:2px; background-color:#ffffff;background:#73d0d6"> 
    <h4 id="msat4" style="font-family:Tahoma;color:#ffffff">@img.header</h4> 
    <h4 id="msat4" style="font-family:Tahoma;border-bottom:solid;border-color:#fff;color:#43749c; border-width:1px;margin-right:20px;margin-left:20px"></h4> @for (int i = 0; i 
    < img.subItem.Count; i++) { <div id="subjectClickwd" @*value="@img.subItem[i].pTextID" *@ readonly rows="auto" style=" direction:rtl; background-color:#def2fa;font-family:font-nazanin;color:#1162a4;font-weight: bold;cursor:pointer;font-size:22px;text-align:right; text-align:justify ;outline-style:none; resize:none; width:100%; border:none;padding:8px;height:auto"> 
    @img.subItem[i].textLink</div> 
<textarea rows="3" id="note" style="direction:rtl; font-family:font-nazanin;font-size:23px;text-align:right; text-align:justify ;margin-top:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px; resize:none; width:100% ;outline-style:none; border:none;padding:10px">@img.subItem[i].summary</textarea> 
} 
<input type="button" value="@img.header" class="form-control" id="" /> 
</div> 

<br /> 
} 
:

$('#subjectClick').click(function() { 

      var subInput = $('#subInput').val(); 
      alert(subInput); 
      var funcUrl = window.location.protocol + '//' + window.location.host + '/Home/SubjectClick?subInput=' + subInput; 
      $.ajax({ 
       type: 'POST', url: funcUrl, 
       contentType: "application/json; charset=utf-8", 
       dataType: "json", 
       cache: false, 
       async: false, 
       success: function (data) { 
        $('#paragraph').hide(); 
        $('#paragraphTXT').show(); 
        $('#text').text(data.text); 
        $('#subject').text(data.sub); 
       }, error: function (data) { 
        alert("Error in json SubjectClick clicking"); 
       } 
      }); 
     }); 

답변

0

거의 포인터하면 시작할 수 있습니다.

  • 페이지의 ID 요소는 고유해야합니다. ("subjectClickwd"는이 경우, div 요소의 ID 특성이며,이 경우에 더 이상의 원소를 갖는 것) 그렇게, 요소가 아직 존재하지 않는 결합 이벤트시를

  • 을 미래의 요소가 이벤트를 처리 할 수 ​​있도록 이벤트 위임에 의존해야합니다.

대신 id 특성을 클래스로 바꾸고 이벤트 위임을 사용하여 이벤트를 바인딩하십시오.

그런 다음

$(document).on('click', '.subjectClick', function() { 

$('#subjectClick').click(function() { 

에서 이벤트 핸들러를 변경

<div class="subjectClickwd" 
<textarea rows="3" class="note" 

<div id="subjectClickwd" 
<textarea rows="3" id="note" 

에서 HTML을 변경

관련 문제