페이지에서 텍스트 영역의 변경을 감지하고이 특정 입력의 변경된 데이터를 다른 테이블에 추가

debugcn 에 게시 Dev

안드로이드

나는 과학적 번호로 인간의 치아를 열거하는 웹 양식을 가지고 있습니다.

일반적으로 의사는 작업 중이던 치아에 변화를 추가합니다. 예를 들어, 18 번 치아가 왕관을 씌운 곳에 있습니다. 그러나 그는 나중에 약속에서 다른 조치를 취 했으므로 이동하여 변경 사항을 추가합니다.

내가 원하는 것은 치아 테이블에 32 개의 열이 있고 각 열이 치아를 나타 내기 때문에 변경된 텍스트 영역과 변경되지 않은 부분을 감지하는 것입니다. 그리고 다른 insert쿼리를 수행 할 수 있도록 어떤 데이터가 변경되었는지 감지해야합니다. 다른 테이블.

내 질문은 32 열의 변경을 감지하고 새 데이터를 다른 2 열 테이블에 삽입하는 데 사용하는 방법입니다.

다음은 일부 텍스트 영역의 HTML 코드입니다.

  <textarea style="height:50px" class="form-control" id="one" name="one" placeholder="18 - 3rd Molar"><?php echo $resTeeth['one'] ?></textarea>
                    <textarea style="height:50px" class="form-control" id="two" name="two" placeholder="17 - 2nd Molar"><?php echo $resTeeth['two'] ?></textarea>
                    <textarea style="height:50px" class="form-control" id="three" name="three" placeholder="16 - 1st Molar"><?php echo $resTeeth['three'] ?></textarea>
                    <textarea style="height:50px" class="form-control" id="four" name="four" placeholder="15 - 2nd Bicuspid"><?php echo $resTeeth['four'] ?></textarea>
                    <textarea style="height:50px" class="form-control" id="five" name="five" placeholder="14 - 1st Bicuspid"><?php echo $resTeeth['five'] ?></textarea>
                    <textarea style="height:50px" class="form-control" id="six" name="six" placeholder="13 - cuspid"><?php echo $resTeeth['six'] ?></textarea>
                    <textarea style="height:50px" class="form-control" id="seven" name="seven" placeholder="12 - lateral"><?php echo $resTeeth['seven'] ?></textarea>
                    <textarea style="height:50px" class="form-control" id="eight" name="eight" placeholder="11 - central"><?php echo $resTeeth['eight'] ?></textarea>

레이온

data-*와 관련된 추가 정보를 저장 하려면 속성을 사용하십시오 HTML element.

data-value속성의 값을 유지 value하고 요소의 속성으로 테스트하십시오 .

$('button').on('click', function() {
  var changed = [];
  var unChanged = [];
  $('textarea').each(function() {
    if ($(this).data('value') != this.value) {
      changed.push(this.id);
    } else {
      unChanged.push(this.id);
    }
  });
  $('#data').html((changed.join(', ') || 'None') + ' are changed!<br>' + (unChanged.join(', ') || 'None') + ' are not changed!');
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div id="data"></div>
<button>Test</button>
<br>
<textarea data-value="one" style="height:50px" class="form-control" id="one" name="one" placeholder="18 - 3rd Molar">one</textarea>
<textarea data-value="two" style="height:50px" class="form-control" id="two" name="two" placeholder="17 - 2nd Molar">two</textarea>
<textarea data-value="three" style="height:50px" class="form-control" id="three" name="three" placeholder="16 - 1st Molar">three</textarea>
<textarea data-value="four" style="height:50px" class="form-control" id="four" name="four" placeholder="15 - 2nd Bicuspid">four</textarea>
<textarea data-value="five" style="height:50px" class="form-control" id="five" name="five" placeholder="14 - 1st Bicuspid">five</textarea>
<textarea data-value="six" style="height:50px" class="form-control" id="six" name="six" placeholder="13 - cuspid">six</textarea>
<textarea data-value="seven" style="height:50px" class="form-control" id="seven" name="seven" placeholder="12 - lateral">seven</textarea>
<textarea data-value="eight" style="height:50px" class="form-control" id="eight" name="eight" placeholder="11 - central">eight</textarea>

바이올린 데모

live-change모든 textarea요소 를 읽으려면 input이벤트를 사용하십시오 .

$('textarea').on('input', function() {
  if ($(this).data('value') != this.value) {
    $('#data').text(this.id + ' is changed!');
  } else {
    $('#data').text(this.id + ' is not changed!');
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div id="data"></div>
<textarea data-value="one" style="height:50px" class="form-control" id="one" name="one" placeholder="18 - 3rd Molar">one</textarea>
<textarea data-value="two" style="height:50px" class="form-control" id="two" name="two" placeholder="17 - 2nd Molar">two</textarea>
<textarea data-value="three" style="height:50px" class="form-control" id="three" name="three" placeholder="16 - 1st Molar">three</textarea>
<textarea data-value="four" style="height:50px" class="form-control" id="four" name="four" placeholder="15 - 2nd Bicuspid">four</textarea>
<textarea data-value="five" style="height:50px" class="form-control" id="five" name="five" placeholder="14 - 1st Bicuspid">five</textarea>
<textarea data-value="six" style="height:50px" class="form-control" id="six" name="six" placeholder="13 - cuspid">six</textarea>
<textarea data-value="seven" style="height:50px" class="form-control" id="seven" name="seven" placeholder="12 - lateral">seven</textarea>
<textarea data-value="eight" style="height:50px" class="form-control" id="eight" name="eight" placeholder="11 - central">eight</textarea>

여기 바이올린

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정2021-06-7

몇 마디 만하겠습니다

0리뷰

로그인참여 후 검토

Related 관련 기사

기사