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

116

05 апреля 2021, 14:20

Как сделать чтобы при нажатии на одну и ту же form дважды или больше, функция не работала? Но при нажатии на другие form (Не та что ранее) функция работала вновь, и после если нажать обратно на ту изначальную, функция должна понять что её нажимают впервые

$(document).ready(function () {
    $('form').on('click', function (e) {
        var files = [];
        var cnt = 0;
        $(this).siblings().addBack().each(function () {
            files[cnt] = $(this).text();
            cnt++;
        });
        var text = files[0].substr(0, files[0].indexOf("Delete"));
        var textarea = text.replace(/\s{2,}/g, ' ');
        $('#myTextarea').val(textarea.toString());
        $('#myTextarea').innerHTML = textarea.toString();
        console.log(cnt)
        for (i = 0; i < cnt; i++) {
            console.log(files[i])
        }
        console.log(textarea);
        // console.log("Textarea value is " + $('#myTextarea').val());
        console.log("Textarea value is " + textarea);
    });
});

<td id="<%=cnt%>" data-toggle="modal"
data-target="#uiModal">
<% cnt++;%>
<div tabindex="0" class="multi">
    <form action="../java/Save.jsp"
          method="post">
        <textarea name="text" rows="4" cols="25"
                  class="border border-info"
                  style="font-size: 4px; margin-left: 2px; margin-top: 2px; border: 0.5px solid #001f3f !important;"><%=task[i * 15 + k]%></textarea>
        <br>
        <a style="font-size: 2px; width: 15px; padding-left: 0.5px; padding-right: 0.5px;"
           class="btn"
           href=<%= "\"../java/DeleteTask.jsp?primaryid=" + PrimaryID + "&username=" + username + "&id=" + 11 + "\"" %>>Delete</a>
        <input type="hidden" name="primaryid"
               value="<%=PrimaryID%>"/>
        <input type="hidden" name="username"
               value="<%=username%>"/>
        <input type="hidden" name="id"
               value="<%=i * 15 + k%>"/>
        <input class="btn" type="submit"
               value="Save"
               style="width: 15px; font-size: 2px; padding-left: 0.5px; padding-right: 0.5px;">
    </form>
    <form action="../java/MoveTask.jsp"
          method="post">
        <input type="hidden" name="text"
               value="<%=task[i * 15 + k]%>"/>
        <input type="hidden" name="primaryid"
               value="<%=PrimaryID%>"/>
        <input type="hidden" name="username"
               value="<%=username%>"/>
        <input type="hidden" name="id"
               value="<%=i * 15 + k%>"/>
        <select class="ui-select" size="3"
                style="margin-left: 2px; font-size: 2px; width: 24.5px;"
                name="first" required>
            <option value="1">В очереди</option>
            <option value="2">В работе</option>
            <option value="3">На тесте</option>
            <option value="4">Выполнено</option>
            <option value="5">На сопровождении
            </option>
        </select>
        <select class="ui-select" size="3"
                style="font-size: 2px; width: 10px;"
                name="second" required>
            <%
                for (int j = 1; j <= 15; j++) {
            %>
            <option><%=j%>
            </option>
            <%
                }
            %>
        </select>
        <input class="btn" type="submit"
               value="Move"
               style="width: 15px; font-size: 2px; padding-left: 0.5px; padding-right: 0.5px;">
    </form>
</div>

Answer 1

На сколько я понял должно было получиться чтото такое :

$(document).ready(function() { 
  let previousClickedId; 
  $('form').on('click', function(e) { 
    if (!previousClickedId || previousClickedId != this.id) { 
      console.log(`new click, id = ${this.id} (do something)`); 
      previousClickedId = this.id; 
    } else { 
      console.log(`same click, id = ${this.id} (do nothing)`); 
    } 
  }); 
});

form { 
  width: 50px; 
  height: 50px; 
  border: 1px solid red; 
  display: inline-block; 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
<form id="1">1</form> 
<form id="2">2</form> 
<form id="3">3</form>