Пожалуйста, объясните это JQuery

Question

Возможно, мой последний вопрос (теперь удаленный) был неправильно понят, поэтому на этот раз я делаю это с большей ясностью:

jQuery (UI):

$("#tabs").tabs({
   select: function(event, ui) { 
        alert(ui.panel.id);
        $('input[name=myinput], textarea[name=myinput]').attr('disabled', true); 
        $('input[name=myinput].' + ui.panel.id + ', textarea[name=myinput].' + ui.panel.id).removeAttr('disabled'); 
        $('input[name=source]').val(ui.panel.id);
   }
});

HTML:

<div id='tabs'>
    <ul>
        <li><a href="#direct">Direct input</a></li>
        <li><a href="#files">File upload</a></li>
        <li><a href="#uri">URI</a></li>
    </ul>
    <div id="direct">
        <textarea name='myinput' class='direct'></textarea>
    </div>
    <div id="file">
       <input type='file' name='myinput' class='file' />
    </div>
    <div id="uri">
       <input type='text' name='myinput' class='uri' />
    </div>
</div>
<input type='hidden' name='source' value='direct' />
<input type='submit' value='GO' />

Я не совсем понимаю, что делает jQuery с вводом.Я хочу использовать обычный jQuery и избегать вкладок «jQueryUI», поэтому важно, чтобы я понимал, что происходит с входными данными, и я могу воспроизвести тот же эффект, когда использую обычный jQuery.Надеюсь, у меня есть смысл.

Спасибо за помощь!

Answer 1

Когда вызывается функция select:

$('input[name=myinput], textarea[name=myinput]').attr('disabled', true);

Найти все input и textarea элементы с именем myinput и отключить их.

$('input[name=myinput].' + ui.panel.id + ', textarea[name=myinput].' + ui.panel.id).removeAttr('disabled');

Найти любойinput элементы и textarea элементы с именем myinput и класс, который соответствует значению свойства ui.panel.id и включает их.

$('input[name=source]').val(ui.panel.id);

Найдите *Элемент 1020 * (или элементы, но я уверен, что есть только один) с именем source и установите его значение равным значению свойства ui.panel.id.

Например: Отключить всеэлементов myinput input и textarea , за исключением , которые соответствуют свойству ui.panel.id в соответствии с его классом, и задайте для этого свойства значение input с именем source,предположительно, чтобы отслеживать, какие входы включены / какая вкладка отображается.

Answer 2

.tabs() - это плагин пользовательского интерфейса jQuery, который превращает разметку, которую вы только что дали, в интерфейс просмотра с вкладками. Вы можете написать свою собственную tabs() функцию в jQuery, если хотите, но вы можете легко загрузить пользовательскую сборку jQuery UI . Отмените выбор всего, затем выберите вкладки (для этого требуются только Core и Widget) ...

Если у вас уже есть замена вкладок, T.J. составьте солидный ответ, описывающий, что делает обработчик событий select. Он срабатывает каждый раз, когда вы выбираете новую активную вкладку.

Answer 3

Похоже, у вас ошибочное впечатление, что jQuery UI - это версия jQuery.На самом деле это плагин jQuery.Он довольно тяжелый, весит много килобайт.Воспроизвести код вкладки jquery ui без использования jquery ui было бы значительным усилием.Код, который вы нам показали, просто вызывает jquery ui для создания вкладок, но плагин вкладок выполняет огромную работу за сценой.Вы можете переосмыслить свое желание отойти от jquery UI.