如何解决如何正确构造代码,仍然可以使用$thisvar?
多次使用上传脚本时,每次发布多个脚本时都会出现问题。
我发现我不是因为发生了嵌套事件,现在,如果我不这样做,就无法使用从首次点击事件中设置的VAR。
我该如何以不重复事件的形式构造代码,而仍然可以使用我的VAR?
JS:
$(document).ready(function(){
$('.editRow').on("click",function(){
$("#editDoc").slideToggle(500);
var popup = $("#editDoc");
var editparent = $(this).closest(".avdExpand");
var row = $(this).closest(".admDoc");
var rowID = $(row).attr("data-row");
var link = $(row).attr("data-link");
var rev = $(row).attr("data-rev");
var revNext = parseInt(rev) + 1;
var editLink = $(row).attr("data-edit-link");
var dokTypDiv = $(row).find(".dokTyp");
var dokTyp = $(dokTypDiv).text();
var dokNamnDiv = $(row).find(".dokNamn");
var dokNamn = $(dokNamnDiv).text();
var dokNrDiv = $(row).find(".dok_nr");
var dokNr = $(dokNrDiv).text();
console.log(dokTyp);
console.log(popup);
var fileNote = $(popup).find(".note:first");
var newFileNote = ""+dokNr+" "+dokTyp+" "+dokNamn+"";
$(fileNote).html(newFileNote);
$(popup).find("a").attr("href",editLink);
$(popup).find(".center").html("<div>Rev "+rev+" </div><div><i class='fas fa-long-arrow-alt-right'></i></div><div> Rev "+revNext+"</div>");
var AppendButton = $(popup).find(".editFormButton");
var appendForm = $(popup).find("#editForm");
var inputFilNamn = '<div class="inputRow"><input class="appendInput" type="text" name="namn" value="'+dokNamn+'"></div>';
var inputDok1 = '<div class="boxes"><div class="box"><input type="file" name="file-1" id="file-1" class="inputfile inputfile-1 addRollWord" data-multiple-caption="{count} files selected" multiple /><label for="file-1"><i class="far fa-file-word" width="100%" height="17" viewBox="0 0 20 17"></i> <span>Välj fil</span></label></div></div>';
var inputDok2 = '<div class="boxes"><div class="box"><input type="file" name="file-2" id="file-2" class="inputfile inputfile-2 addRollPDF" data-multiple-caption="{count} files selected" multiple /><label for="file-2"><i class="far fa-file-pdf" width="100%" height="17" viewBox="0 0 20 17"></i> <span>Välj fil…</span></label></div></div>';
console.log(appendForm);
$(appendForm).append(inputFilNamn);
var oneFile = ["Mall","Checklista","Övrigt"];
if( $.inArray(dokTyp,oneFile) != -1){
$(appendForm).append(inputDok1);
} else {
$(appendForm).append(inputDok1);
$(appendForm).append(inputDok2);
}
$(appendForm).append('<input class="appendInput" type="hidden" name="id" value="'+rowID+'">');
;( function( $,window,document,undefined ) {
$( '.inputfile' ).each( function() {
var $input = $(this),$label = $input.next( 'label' ),labelVal = $label.html();
$input.on('change',function(e) {
var fileName = '';
if( this.files && this.files.length > 1 )
fileName = ( this.getAttribute( 'data-multiple-caption' ) || '' ).replace( '{count}',this.files.length );
else if( e.target.value )
fileName = e.target.value.split( '\\' ).pop();
if( fileName )
$label.find( 'span' ).html( fileName );
else
$label.html( labelVal );
});
// Firefox bug fix
$input
.on( 'focus',function(){ $input.addClass( 'has-focus' ); })
.on( 'blur',function(){ $input.removeClass( 'has-focus' ); });
});
})( jQuery,document );
$('.editForm').submit(function(e) {
e.preventDefault();
var knapp = $(this);
var parent = $(this).closest(".admExpandAdd");
var appenddiv = $(this).closest(".avdExpandContainer").children(".avdExpand.R");
var dokTyp = $(parent).find(".addRollTyp").val();
var process = $(parent).find(".addRollProcess").val();
var avd = $(parent).find(".addRollAvd").val();
var namn = $(parent).find(".addRollNamn").val();
$.ajax({
url: "scripts/s_editDoc.php",// Change this to your PHP update script!
type: 'POST',processData: false,// important
contentType: false,// important
data: new FormData(this),dataType: 'json',success: function(ret){
$('input[type="radio"]').prop('checked',false);
var id = ret.id;
var dokTyp = ret.dokTyp;
var dokNamn = ret.dokNamn;
var link = ret.link;
var editLink = ret.editLink;
var rev = ret.rev;
var dokNr = ret.dokNr;
$('#editForm')[0].reset();
$(".appendInput").remove();
$(".boxes").remove();
$(".popupdiv").hide();
console.log(row);
$(row).replaceWith('<div class="admDoc" data-rev="'+$.trim(rev)+'" data-row="'+$.trim(id)+'" data-link="'+$.trim(link)+'" data-edit-link="'+$.trim(editLink)+'"><div class="note dokTyp">'+$.trim(dokTyp)+'</div><a target="blank" href="'+$.trim(link)+'"><div class="dokNamn">'+$.trim(dokNamn)+'</div></a><div class="note dok_nr">'+$.trim(dokNr)+'</div><div class="note rev">Rev '+$.trim(rev)+'</div><div class="icons"><div><i class="fas fa-link tooltip"><span class="tooltiptext">'+$.trim(link)+'</span></i></div><div class="editRow"><i class="far fa-edit"></i></div><div class="deleteRow"><i class="far fa-trash-alt"></i></div></div></div>')
},error: function(ret){
console.log(ret.response);
}
});
});
});
});
HTML Popupform:
<div class="popupdiv hidden" id="editDoc">
<div class="popupHeader">
<h1>Uppdatera dokument</h1>
<div class="absolute-topright closeDocForm"><button class="closeWindow"><i class="far fa-window-close"></i></button></div>
</div>
<div class="container">
<div class="blockheader"><div class="blockHeaderIcon"><i class="fas fa-circle"></i><h3 class="blockHeaderNumber">1</h3></div><h3 class="blockHeaderText">Redigera filen</h3> <p class="note"> AM20:009 Filnamn Mall</p></div>
<div class="block">
<div class="blockrow geteditfile"><div>Ladda ned filen för redigering</div><a href=""><div class="getEditFile"><i class="fas fa-arrow-alt-circle-down"></i> Hämta fil</div></a></div>
<div class="blockrow">Revisionsnummer kommer att uppdateras:</div>
<div class="blockrow center"></div>
</div>
<div class="blockheader"><div class="blockHeaderIcon"><i class="fas fa-circle"></i><h3 class="blockHeaderNumber">2</h3></div><h3 class="blockHeaderText">Save File</h3></div>
<div class="block">
<form class="editForm" id="editForm">
</form>
</div>
<div class="blockheader"><div class="blockHeaderIcon"><i class="fas fa-circle"></i><h3 class="blockHeaderNumber">3</h3></div><h3 class="blockHeaderText">Approval</h3> <p class="note">Bla bla bla</p></div>
<div class="block">
<div class="blockrow"><div>bla bla bla.</div></div>
HTML数据行:
<div class="admDoc" data-rev="2" data-row="232" data-link="VS/Kvalitet/Instruktion/AM20_001_Riskanalys.pdf" data-edit-link="VS/Kvalitet/Instruktion/AM20_001_Riskanalys.doc">
<div class="note dokTyp">Instruktion</div>
<a target="blank" href="VS/Kvalitet/Instruktion/AM20_001_Riskanalys.pdf">
<div class="dokNamn">Riskanalys</div></a>
<div class="note dok_nr">AM20:001</div>
<div class="note rev">Rev 2</div>
<div class="icons">
<div><i class="fas fa-link tooltip"><span class="tooltiptext">VS/Kvalitet/Instruktion/AM20_001_Riskanalys.pdf</span></i></div>
<div class="editRow"><i class="far fa-edit"></i></div>
<div class="deleteRow"><i class="far fa-trash-alt"></i></div>
</div>
</div>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。