问题
I am fairly new to jQuery and just as I was starting to get the hang of it, I came across a site that I am trying to view offline that uses requireJS. I think there is a lot going on in the app that is making the requireJS functionality break down. So I am trying to get rid of all app-specific functionality (since I already loaded the pages and saved resources for offline viewing) and just have pure jQuery handling all the page interaction (like audio players, content revealers, etc).
Here is an example of a requireJS bit that I am trying to convert. This is what I see in a compiled js file that contains all app js:
define("site/mixins/interactions/reveal_content", ["exports", "jquery"], function(e, t) {
function n(e) {
this.el = e, this.interactionData = e.find(".interaction_data"), this.container = e.find(".interaction_content")
}
n.prototype = {
init: function() {
var e = (0, t.default)("<div />").append((0, t.default)(this.interactionData.find("td")[1]).detach()),
n = (0, t.default)('<div class="pointer" />').append((0, t.default)(this.interactionData.find("td")[0]).detach());
this.container = this.container.parent().find(".RevealContent"), this.container.append(n), this.container.append(e.hide()), n.click(function() {
(0, t.default)(e).slideToggle("slow")
}), n.find("a").click(function(e) {
e.preventDefault()
})
}
}, e.default = n
})
So my understanding is that these define statements include modules/libraries needed to run. So the declaration of "export" and "jquery". And while I see a jquery.js file in the saved resources for the site, I don't see anything called exports.js and so not sure what this even refers to. Or maybe it is not a file but an array needed at some other point in the app, but the whole point is I am trying to avoid all this app-like functionality since everything I am doing offline is after the app has already loaded...
For what it is worth, here is the actual reveal_content.js file that is being used by whatever mapping is producing the comiled app js file:
define("bocce/mixins/interactions/reveal_content", ["exports", "jquery"], function(exports, _jquery) {
function RevealContent($el) {
this.el = $el;
this.interactionData = $el.find(".interaction_data");
this.container = $el.find(".interaction_content");
}
RevealContent.prototype = {
init: function init() {
var contentToReveal = (0, _jquery["default"])('<div />').append((0, _jquery["default"])(this.interactionData.find('td')[1]).detach());
var initialContent = (0, _jquery["default"])('<div class="pointer" />').append((0, _jquery["default"])(this.interactionData.find('td')[0]).detach());
this.container = this.container.parent().find('.RevealContent');
this.container.append(initialContent);
this.container.append(contentToReveal.hide());
initialContent.click(function() {
(0, _jquery["default"])(contentToReveal).slideToggle('slow');
});
// prevent any links within initialContent from navigating anywhere
initialContent.find('a').click(function(e) {
e.preventDefault();
});
}
};
exports["default"] = RevealContent;
});
Anyway, I am trying to get above working as jQuery, so that on the offline page, wherever there is an element with an ascendant containing "RevealContent" in a class name, that the above requireJS functionality is executed as plain jQuery, without any superfluous function calls (so with these e and n functions and variables shown in my first code snippet above).
Any pointers will be vastly appreciated!
thanks
来源:https://stackoverflow.com/questions/54172327/how-to-convert-a-requirejs-function-to-plain-jquery