Использование Javascript внутри динамической загрузки UserControl в jQuery Ui Tabs

Question

Мне нужно вставить код JavaScript внутри UserControl, который я загружаю из вызова Ajax через jQuery Ui Tabs. Позвольте мне объяснить ...

Это мой View (с JQuery загружен)

<script type="text/javascript"> 
    $(document).ready(function() { 
     $("#tabs").tabs({ 
     cache: false, 
     }); 
     getContentTab (1); 
    }); 

    function getContentTab(index) { 
     var url='<%= Url.Content("~/Home/getUserControl") %>/' + index; 
     var targetDiv = "#tabs-" + index; 

     $.get(url,null, function(result) { 
      $(targetDiv).html(result); 
     }); 
    } 
</script> 

<div id="tabs"> 
    <ul> 
     <li><a href="#tabs-1" onclick="getContentTab(1);">Nunc tincidunt</a></li> 
     <li><a href="#tabs-2" onclick="getContentTab(2);">Proin dolor</a></li> 
     <li><a href="#tabs-3" onclick="getContentTab(3);">Aenean lacinia</a></li> 
    </ul> 
    <div id="tabs-1"> 
    </div> 
    <div id="tabs-2"> 
    </div> 
    <div id="tabs-3"> 
    </div> 
</div> 

С помощью этих строк кода я вызываю функцию Ajax, чтобы загрузить содержимое в DIV. Это действие от контроллера:

public ActionResult getUserControl(int num) 
    { 
     return PartialView("TestUC", num); 
    } 

И это UserControl ...

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl" %> 
Number... <span id="testSpan"><%=Model.ToString() %></span>!! 
<input type="button" value="Click me!!" onclick="message();" /> 
<script type="text/javascript"> 
function message(item) { 
    alert($("#testSpan").html()); 
} 
</script> 

Проблема заключается в том, что функция сообщения() всегда возвращает 1 (вместо возвращения правильный номер).

Мой вопрос ... Как добавить скрипт в свой UserControl, чтобы мой код работал правильно?

Answer 1

Я просто угадываю здесь.

Я думаю, ваша проблема в том, что при загрузке вкладки она остается в DOM, даже если вы открываете другую (т. Е. Если № 1 по умолчанию, она останется загруженной, даже если вы нажмете на вторую) ,

Если это происходит, когда вы вызываете функцию сообщения, будет существовать несколько элементов с идентификатором «testSpan», а селектор jQuery $ («# testSpan») вернет первое из них.

Я полагаю, что это всего лишь некоторый тестовый код, но для этого конкретного случая я бы пошел с добавлением <% = Model.ToString()%> в качестве аргумента функции javascript.

Опять же, я просто догадываюсь о поведении функции jquery-ui tabs().

С уважением

Answer 2

Try Добавление сценария, как этот

<script type="text/javascript" defer="defer"> 
function message(item) { 
    alert($("#testSpan").html()); 
} 
</script>