Как отредактировать несжатую библиотеку jQuery для установки моего собственного требования в функции?

Question

У меня есть задача, в которой я должен включить конкретное требование в функцию. Код CDN jQuery выглядит немного сложно понять по сравнению с обычным jQuery, который мы используем.

Проблема в том, что, когда я сосредотачиваюсь на чем-то вроде блока input, он должен не просто сосредоточиться на нем, но и вернуть его top и left. Предполагается, что эта функциональность будет включена в файл CDN. Затем, используя обычную программу, я должен ее назвать.

$(document).ready(function(){ 
    $("input").focus(function(){ 
     $("input").css("background", "lightblue"); 
     var p = $("input"); 
     var position = p.offset(); 
     $("div").text("left: " + position.left + ", top: " + position.top);  
    }); 
}); 

Answer 1

Во-первых, никогда не изменяйте источник библиотеки. Если вы это сделаете, он свяжет вас с этой конкретной версией кода. Если автор обновляет библиотеку, они делают перерыв добавлением, которое вы сделали. Если вы хотите создать дополнительные функции, создайте свои собственные методы расширения или прототипы.

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

$("input").focus(function() { 
 
    var $input = $(this).css("background", "lightblue"); 
 
    var position = $input.offset(); 
 
    console.log("left: " + position.left + ", top: " + position.top); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input /> 
 
<input />

Answer 2

Из моего опыта, что вы пытаетесь сделать, это не рекомендуется. Если библиотека не поддерживается, вы можете получить вилку из своего репита github, а затем добавить свои изменения, чтобы вы могли ее поддерживать.

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

Пройдите официальную документацию, чтобы получить обзор этой функции.

How to create a basic jQuery plugin.