복붙노트

[JQUERY] jQuery를 HTML () 파이어 폭스 (.innerHTML을 사용)에서 DOM의 변화를 무시

JQUERY

jQuery를 HTML () 파이어 폭스 (.innerHTML을 사용)에서 DOM의 변화를 무시

해결법


  1. 1.파이어 폭스, 그냥 그 값 속성을 사용자 입력을 기반으로 DOM 객체의 값 속성을 업데이트하지 않습니다 - 꽤 빠른 해결책은 존재한다.

    파이어 폭스, 그냥 그 값 속성을 사용자 입력을 기반으로 DOM 객체의 값 속성을 업데이트하지 않습니다 - 꽤 빠른 해결책은 존재한다.

    심판:

    function DisplayTextBoxValue(){
      var element = document.getElementById('textbox');
      // set the attribute on the DOM Element by hand - will update the innerHTML
      element.setAttribute('value', element.value);
      alert(document.getElementById("container").innerHTML);             
      return false;
    }
    

    jQuery를 플러그인 차종이 .formhtml 것을 () 자동으로 수행 :

    (function($) {
      var oldHTML = $.fn.html;
    
      $.fn.formhtml = function() {
        if (arguments.length) return oldHTML.apply(this,arguments);
        $("input,button", this).each(function() {
          this.setAttribute('value',this.value);
        });
        $("textarea", this).each(function() {
          // updated - thanks Raja & Dr. Fred!
          $(this).text(this.value);
        });
        $("input:radio,input:checkbox", this).each(function() {
          // im not really even sure you need to do this for "checked"
          // but what the heck, better safe than sorry
          if (this.checked) this.setAttribute('checked', 'checked');
          else this.removeAttribute('checked');
        });
        $("option", this).each(function() {
          // also not sure, but, better safe...
          if (this.selected) this.setAttribute('selected', 'selected');
          else this.removeAttribute('selected');
        });
        return oldHTML.apply(this);
      };
    
      //optional to override real .html() if you want
      // $.fn.html = $.fn.formhtml;
    })(jQuery);
    

  2. 2.이것은 파이어 폭스에서 알려진 "문제"입니다. innerHTML을위한 사양은 완전히 그래서 다른 브라우저 벤더들이 다른 방법으로 그것을 구현, 취소되지 않습니다.

    이것은 파이어 폭스에서 알려진 "문제"입니다. innerHTML을위한 사양은 완전히 그래서 다른 브라우저 벤더들이 다른 방법으로 그것을 구현, 취소되지 않습니다.

    이 주제에 대한 논의는 여기에서 찾을 수 있습니다 :

    http://forums.mozillazine.org/viewtopic.php?t=317838#1744233


  3. 3.당신의 formhtml 플러그인 주셔서 감사합니다. 텍스트 영역에 사용하기 위해, 나는 그것을 업데이트했다 :

    당신의 formhtml 플러그인 주셔서 감사합니다. 텍스트 영역에 사용하기 위해, 나는 그것을 업데이트했다 :

    $("textarea", this).each(function() { 
      $(this).text($(this).val()); 
    });
    

  4. 4.나는 귀하의 질문에 innerHTML을 관련 알지만, 그것은 당신이 다음, 필요하다고 용기 내부의 텍스트 상자의 단지 값이 있다면

    나는 귀하의 질문에 innerHTML을 관련 알지만, 그것은 당신이 다음, 필요하다고 용기 내부의 텍스트 상자의 단지 값이 있다면

    $('#textbox').val()
    

    올바른 (업데이트) 텍스트 상자에 값을 제공 할 것입니다.


  5. 5.(가) 대답을 투표에서 동일한 코드를 빌려 - 또 다른 DOM 접근은 특정 요소에 DEFAULTVALUE을 설정하는 것입니다.

    (가) 대답을 투표에서 동일한 코드를 빌려 - 또 다른 DOM 접근은 특정 요소에 DEFAULTVALUE을 설정하는 것입니다.

    function DisplayTextBoxValue(){
      var element = document.getElementById('textbox');
      element.defaultValue = element.value;    
      alert(document.getElementById("container").innerHTML);             
      return false;
    }
    

    즉, 업데이트 innerHTML을 인쇄한다.

    대신, 특정 원소의 모든 입력 요소에 연결로 jQuery의 용액 좋다. 이것은 모두에게 입력 요소를 감지하는 "DOM은"너무 반복하는에게 DOM을 포함 할 것이다 사용하는 모든 입력 요소에 onchange를 메서드 호출을 추가 할 수 있습니다. 혹시 했나 페이지에있을 거라고 필드를 모른다.


  6. 6.이 업데이트 기능은 수동으로 변경되지 입력 필드에서만 일하고 있었다. 눈에 보이는 입력 텍스트를 업데이트 할 수 표시된 라인을 추가 :

    이 업데이트 기능은 수동으로 변경되지 입력 필드에서만 일하고 있었다. 눈에 보이는 입력 텍스트를 업데이트 할 수 표시된 라인을 추가 :

      // set text input value from the associated sel dropdown and reset dropdown
      function set_input_value(eid, sel) {
          var el = document.getElementById(eid);
          el.setAttribute("value", sel.options[sel.selectedIndex].text);
    
          // added this line to solve the issue:
          el.value = el.getAttribute('value');
    
          sel.selectedIndex=0;
      }
    
  7. from https://stackoverflow.com/questions/1388893/jquery-html-in-firefox-uses-innerhtml-ignores-dom-changes by cc-by-sa and MIT license