javascript - bugged HTML code editor -


 $(document).ready(function() {      	      	var btn = $('.gen');      	btn.on('click', function() {      		var areatxt = $('.textarea').val();      		var div = $('.result');      		div.html(areatxt);      	});      	      });
.result {      border: 1px solid red;      width: 300px;      height: 150px;      }      .textarea {      	width: 300px;      	height: 150px;      }
<!doctype>      <html>      <head>      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>      <title>untitled document</title>        </head>      <body>      <textarea class="textarea"></textarea>      <input type="button" class="gen" value="generate">      <div class="result"></div>      </body>      </html>

i've created simple html code editor. problem when add style classes or divs affect code editor.

i want editor of w3school. show result in iframe code in textarea affect result area.

http://jsfiddle.net/sederther/4x6dxrs5/

check fiddle here

just did few tweaking. added dummy attribute 'textarea' , set value attribute. loop through element , check attribute, if found reset styles applied.

$(document).ready(function() {          var btn = $('.gen');         btn.on('click', function() {             var areatxt = $('.textarea').val();             var div = $('.result');             div.html(areatxt);                //code addtion             $("textarea").each(function(){                 var attr =                  $(this).attr('dataref');                 if (typeof attr !== typeof undefined && attr !== false && attr == 'source') {  $(this).attr('style', 'background-color: #eee !important');  }             })         });      }); 

in case, looping 'textareas' , check if has 'dataref' attribute , value equals source. if reset style. know tedious work on elements in similar manner, without using iframe can work around.

my 2 cents


Comments

Popular posts from this blog

c++ - QTextObjectInterface with Qml TextEdit (QQuickTextEdit) -

javascript - angular ng-required radio button not toggling required off in firefox 33, OK in chrome -

xcode - Swift Playground - Files are not readable -