javascript - JQuery ONLY works in compatibility mode -


i working on creating web application displayed on local intranet site
nb using ie11
takes information xml file , cycles through it, displaying each section in turn. have had use old version of jquery in order make work on system it'll running on, using 1.12.4. problem page pulls in information in first instance, after nothing. quick check in debugging console tells me page unable property 'childnodes' of undefined or null reference - seems strange me works in first instance. if run page in compatibility view, script works properly, destroys of styling etc. there way fix or going have deal awful compatibility view styled page?
my code below
html

<div id="mainnews">     <div class="panel panel-default" id="mainnewsstory">         <h1 id="storyheadline"></h1>         <p id="storybody"></p>     </div>     <img id="storyimage" src=""/> </div>

xml

<newsarticle> <story>     <storyheadline>this headline of first news story!</storyheadline>     <storybody>this body of first news story. lorem ipsum dolor sit amet, consectetur adipiscing elit. nullam id nunc ex.</storybody>     <storyimage>images\imageone.png</storyimage> </story> <story>     <storyheadline>this second headline! accompanies second story</storyheadline>     <storybody>this body of second news story. lorem ipsum dolor sit amet, consectetur adipiscing elit. nullam id nunc ex.</storybody>     <storyimage>images\imagetwo.png</storyimage> </story> <story>     <storyheadline>this third headline now!</storyheadline>     <storybody>this body of third news story. lorem ipsum dolor sit amet, consectetur adipiscing elit. nullam id nunc ex.</storybody>     <storyimage>images\imagethree.png</storyimage> </story>

javascript

$(function(){ $.ajax({     type: "get",     url: "setscreen.xml",     datatype: "xml",     success: parsexml });  function parsexml(xml) {     //--fill content in main news story start--//     var storycount = 0;     var xstories = xml.getelementsbytagname("storyheadline");     var xstorybody = xml.getelementsbytagname("storybody");     var xstoryimage = xml.getelementsbytagname("storyimage")     var maxstories = xstories.length;     function fillstory(){         $('#storyheadline').html(xstories[(storycount) % maxstories].childnodes[0].nodevalue);         $('#storybody').html(xstorybody[(storycount) % maxstories].childnodes[0].nodevalue);          $('#storyimage').prop("src", xstoryimage[(storycount++) % maxstories].childnodes[0].nodevalue);     }     //--fill content in main news story end--//      fillstory();     var storytimer = setinterval(fillstory, 2000); } });

any appreciated.

edit: original 'fix' stopped working after 5 page loads, delved little deeper, , managed find root(s) of problem.

turned out combination of couple of things. managed force page styling , remain normal in compatibility view using 

<meta http-equiv="x-ua-compatible" content="ie=edge" />

as first tag in <head>. solved awful styling problem, if page forced compatibility view. source here.



contributor problem had xml file contained following header can apparently break in ie.

<?xml version="1.0" encoding="utf-8" ?>

so removing allowed javascript run. source.



final problem had once javascript running, run few times before stopping, , tell me couldn't access variables trying to. first tried declaring variables inside function, meant declared every time function ran, caused unsightly memory issues. moved declaring variables outside of function, assigning values inside. 

var storycount = 0;     var xstories, xstorybody, xstoryimage, maxstories;     function fillstory() {         xstories = xml.getelementsbytagname("storyheadline");         xstorybody = xml.getelementsbytagname("storybody");         xstoryimage = xml.getelementsbytagname("storyimage");         maxstories = xstories.length;         $("#storyheadline").html(xstories[(storycount) % maxstories].childnodes[0].nodevalue);         $("#storybody").html(xstorybody[(storycount) % maxstories].childnodes[0].nodevalue);         $("#storyimage").prop("src", xstoryimage[(storycount) % maxstories].childnodes[0].nodevalue);         storycount = storycount + 1;

so works want to!


-

Comments

Post a Comment

Popular posts from this blog

unity3d - Rotate an object to face an opposite direction -

i have object , b. when click on object b, rotates object b (a faces b). b doesn't face a. need following : when faces b, need face opposite direction. have code rotating @ b. how rotate face opposite direction after that? vector3 targetdirection = target - transform.position; float step = speed * time.deltatime; vector3 newdirection = vector3.rotatetowards (turretdome.transform.forward, targetdirection, step, 0.0f); turretdome.transform.rotation = quaternion.lookrotation (newdirection); you object facing object b, want inverse direction of object after that? objecta.transform.rotation = quaternion.inverse(objecta.transform.rotation) but lets assume example turretdome object a, (negate direction): turretdome.transform.rotation = quaternion.lookrotation (-newdirection); naturally, both of these snippets not show how smoothen rotation, seem know how use time.deltatime. just incase unsure, quaternion.lerp this
Read more

angular - Is it possible to get native element for formControl? -

i've got angular2 reactive form . created formcontrol s , assigned input fields by [formcontrol]=... . understand creates nativeelement <-> formcontrol link. my question: possible nativeelement formcontrol ? wanna myformcontrol.nativeelement.focus() i can share 1 terrible solution works me. in reactive forms can use either 1) formcontroldirective ts mycontrol = new formcontrol('') template <input type="text" [formcontrol]="mycontrol"> or 2) formcontrolname ts myform: formgroup; constructor(private fb: formbuilder) {} ngoninit() { this.myform = this.fb.group({ foo: '' }); } template <form [formgroup]="myform"> <input type="text" formcontrolname="foo"> </form> so these directives write patch like 1) formcontroldirective const originformcontrolngonchanges = formcontroldirective.prototype.ngonchanges; formcontroldirective.proto
Read more

javascript - Why jQuery Select box change event is now working? -

i working on product filters user select select box according his/her preference not getting selected value user in jquery. html code:- <select name="product_filter" id="product_filter"> <option value="price_low_first">price : low high</option> <option value="price_high_first">price : high low</option> <option value="latest">latest</option> <option value="popular">most popular</option> </select> jquery code: $(function () { $("#product_filter").change(function () { alert("hi") var selectedtext = $(this).find("option:selected").text(); var selectedvalue = $(this).val(); alert("selected text: " + selectedtext + " value: " + selectedvalue); }); }); hi believe code perfect. once please check jquery.min.js
Read more