Копирование кода плагина с помощью JQuery On()?

Прошло некоторое время с тех пор, как я использовал jquery, в последний раз, когда я использовал запрос .live, все еще было.Копирование кода плагина с помощью JQuery On()?

Теперь я вижу, что это было заменено на «On» (я лично не нравится это имя она делает его трудно Google для ответов)

Я использую MaterialzieCss и их модальным $('.modal-trigger').leanModal();

Однако Я хочу загрузить модальный код по запросу (т. Е. Когда что-то нажимает на ссылку, он выполняет вызов ajax и захватывает html для диалога, а затем отображает его пользователю).

Как обернуть $('.modal-trigger').leanModal(); в «on», чтобы он привязался, когда он нашел модальный код?

Прежде чем использовать какой-либо плагин jquery, который сделал это, так как «live» не смог это сделать. Это все еще так?

Редактировать

Вот код, может быть, он будет делать это немного яснее.

Текущий

<body> 
<a class="modal-trigger" data-target="add-modal">Open Modal </a> 
<div id="add-modal" class="modal"> 
    <div class="modal-content"> 
     <p>Hi</p> 
     </form> 
    </div> 
    <div class="modal-footer"> 
     <a href="#!" class=" modal-action modal-close waves-effect waves-green btn-flat left">Add</a> 
     <a href="#!" class=" modal-action modal-close waves-effect waves-green btn-flat ">Cancel</a> 
    </div> 
</div> 
<script> 
$(document).ready(function() 
{ 
    $('.modal-trigger').leanModal(); 
} 
</script> 
</body>

Теперь я хочу, чтобы удалить «# надстройку модальный», чтобы быть по требованию. Когда вы нажимаете ссылку, что «модальный» код будет добавлен в тело.

Может быть, я не могу понять, какие решения были предоставлены, но, позвонив по телефону $('.modal-trigger').leanModal();, каждый раз создавались новые привязки? У меня будет 5 модалов, поэтому каждый раз, когда я буду нажимать на ссылку, она будет открываться, как 5 модалов одного и того же?

источник

2016-05-30 chobo2

'on()' не то, что вам нужно здесь.Вместо этого вы должны просто называть '$ ('. Modal-trigger'). LeanModal()' * inside * - функция обратного вызова запросов AJAX, которые добавляют элемент '.modal-trigger' на страницу. –

Вы, наверное, нужно что-то подобное с ajax:

$.ajax("example.php") 
    .done(function(data) { 
    $('.modal-trigger').leanModal(); 
    });

data, вы уже догадались, данные, возвращаемые. Поэтому, если вы хотите использовать эти данные в качестве ввода HTML для модального, сделайте что-нибудь подобное.

$.ajax("example.php") 
    .done(function(data) { 
    $('.modal-trigger').html(data).leanModal(); 
    });

Вы правы, что в некоторых случаях .on() является предпочтительным. Наиболее важным вариантом использования является то, что вы управляете событиями с пузырьками динамически добавленных элементов. Например, если #container является статическим элементом, а .element был динамически добавлен, это не будет работать, потому что во время запуска сценария этот элемент еще не был, а обработчик события не был присоединен.

$(".element").click(function() { 
    // Do something 
});

Вместо этого назначьте обработчик кликов в контейнер, но делегируйте событие вниз.

$("#container").on("click", ".element", function() { 
    // Do something 
});

Таким образом, поставив все вместе: если вы хотите, чтобы запустить Ajax вызов, нажав на ссылку, которая динамически добавляется, и на успешный может выскочить модальный:

$("#container").on("click", ".link", function() { 
    $.ajax("example.php") 
    .done(function(data) { 
     $('.modal-trigger').html(data).leanModal(); 
    }); 
});

источник

2016-05-30 18:17:07

Я добавил код, надеюсь, это имеет смысл. – chobo2

$(document).on('click', '#buttonid', function(e) { 
    $.get('/getmodalcode') 
    .done(function(data){ 
     $('#outputid').append(data); 
     $('.modal-trigger').leanModal(); 
    }); 
});

Надеюсь, что это достаточно ясно, и я правильно истолковал ваш вопрос.

источник

2016-05-30 18:17:36 DRC

Копирование кода плагина с помощью JQuery On()?

ответ

Смежные вопросы