Javascript 从模块内部引用特定表单元素
我试图找出如何引用模块内部的表单 该模块如下所示:Javascript 从模块内部引用特定表单元素,javascript,jquery,this,module-pattern,Javascript,Jquery,This,Module Pattern,我试图找出如何引用模块内部的表单 该模块如下所示: const UserShows = (function(){ const saveShowToDashboard = function(evt) { evt.preventDefault(); const $saveShowForm = $(this); setTimeout(function() { $saveShowForm.children('.save-show-btn').val('Saved
const UserShows = (function(){
const saveShowToDashboard = function(evt) {
evt.preventDefault();
const $saveShowForm = $(this);
setTimeout(function() {
$saveShowForm.children('.save-show-btn').val('Saved');
}, 500);
const showInfo = $(this).children('.save-show-checkbox').val();
const parsedShowInfo = JSON.parse(showInfo);
const _csrf = $(this).children('.csrf').val();
const artistName = parsedShowInfo.artist;
const data = {
showInfo: parsedShowInfo,
_csrf: _csrf,
};
console.log(data);
$.post('/artists/' + artistName, data, function(res) {
if (res === '/login') {
window.location = res;
}else{
console.log(res);
}
});
};
return {
callSaveShowToDashboard: function(evt){
return saveShowToDashboard(evt);
}
}
})();
// Call saveShowToDashboard on click
$('.save-show').on('submit', UserShows.callSaveShowToDashboard);
我遇到的问题是,我不知道如何引用正在提交的特定save show表单(页面上有几个表单;每个表单对应一个艺术家巡演日期)
在我决定将此函数放入UserShows模块之前,我可以使用$(this)引用特定的表单,但由于表单不再是函数的直接调用者,因此它无法工作。事实证明,使用JQuery,您可以使用event.target引用触发事件的元素。因此,如果我像这样重写代码,它会起作用:
const saveShowToDashboard = function(evt) {
evt.preventDefault();
const $saveShowForm = $(event.target);
setTimeout(function() {
$saveShowForm.children('.save-show-btn').val('Saved');
}, 500);
const showInfo = $saveShowForm.children('.save-show-checkbox').val();
const parsedShowInfo = JSON.parse(showInfo);
const _csrf = $saveShowForm.children('.csrf').val();
const artistName = parsedShowInfo.artist;
const data = {
showInfo: parsedShowInfo,
_csrf: _csrf,
};
console.log(data);
$.post('/artists/' + artistName, data, function(res) {
if (res === '/login') {
window.location = res;
}else{
console.log(res);
}
});
};