www.webdeveloper.com
Page 1 of 2 12 LastLast
Results 1 to 15 of 17

Thread: Replace Function not working in IE8

  1. #1
    Join Date
    Sep 2009
    Location
    oxfordshire, england
    Posts
    210

    Replace Function not working in IE8

    Hi,

    I am having a strange problem, I can get my code to replace html content fine in every browser apart from IE8 but I cannot figure out why. my code is:


    Code:
    function enquires() {
        var a = document.getElementById("div1").innerHTML+(" ");
    var b = a.replace(/<img src="remove.png">/g, ' ');
    var c = b.replace(/style="float: left; width: 140px;"/g, ' ');
    
     var screenshot = document.getElementById("screenshot3"); 
     screenshot.value=g_client.toDataURL(); 
     
    
        document.getElementById('mailBody').value = c;
    
        document.getElementById('costing').value = document.getElementById("cost").innerHTML;
    
    }

  2. #2
    Join Date
    Mar 2012
    Location
    Saint-Petersburg, Russia
    Posts
    97
    You pass regular expression object as a first parameter to replace functions, however you do not escape service characters with backslashes. I think that some browsers fail to understand these malformed regexps.

    You have two options:
    - try to guess which characters need to be escaped (it is not obvious and I could not hint easily - some punctuation ones);
    - pass first parameter as a simple string in double or single quotes - you may be need to escape only quotes inside it.

    Are you pretty sure (by alerting "c" variable for example) that it is exactly "replace" function which fails in IE8, by the way? Not something other in your code? You know I did not tried it...

  3. #3
    Join Date
    Sep 2009
    Location
    oxfordshire, england
    Posts
    210
    Hi Rodion,

    Thanks for the reply, so it is the characters that are causing the problems? I am guessing its things like <, =, ", :, ;?

    I am not entirely sure what you mean with your solution however?

    Thanks for the help,
    Simon

  4. #4
    Join Date
    Mar 2012
    Location
    Saint-Petersburg, Russia
    Posts
    97
    I mean you need to write either something like:
    Code:
    b.replace(/style\=\"float\: left\; width\: 140px\;\"/g, ' ');
    // I do not think all should be escaped... semicolons need not almost certainly...
    or

    Code:
    b.replace('style="float: left; width: 140px;"', ' ');
    But this would work only for first found fragment.

  5. #5
    Join Date
    Feb 2006
    Posts
    2,927
    different browsers return different results for innerHTML-
    tags and attributes may be returned upper case, quotes may not be included, spaces may be truncated.


    You either need a much more robust pattern, or replace the properties from the elements.

  6. #6
    Join Date
    Sep 2009
    Location
    oxfordshire, england
    Posts
    210
    Okay I have tryed using standard text for example I have this inside div1:
    <div style="float: right;">

    I have then used:
    var c = b.replace(/float"/g, ' ');

    However this still isnt removing the float from the div element

  7. #7
    Join Date
    Mar 2012
    Location
    Saint-Petersburg, Russia
    Posts
    97
    You have a quote immediately after "float" - this do not match to text. And as the colleague supposed, try at least add "i" option to your regexp.

  8. #8
    Join Date
    Sep 2009
    Location
    oxfordshire, england
    Posts
    210
    Sorry that is a typo I made on here and isnt in the original script. What do you mean by adding an i? My javascript is very minimal so you might have to bare with my noobiness

  9. #9
    Join Date
    Mar 2012
    Location
    Saint-Petersburg, Russia
    Posts
    97
    About "i" I meant something like:
    Code:
    b.replace(/float/gi, ' ');
    But let us try to find out your problem. Pitifully I have no IE at hand.

    Try the following:
    Code:
    var b = '<div style="float: right;">';
    var c = b.replace(/float/g, ' ');
    alert(c);
    It should work. If it is, then try to alert what you receive from innerHTML at the beginning and post here. We shall try to find out the problem.

  10. #10
    Join Date
    Sep 2009
    Location
    oxfordshire, england
    Posts
    210
    Okay that works, now alerting the html gives the following:

    ---------------------------
    Message from webpage
    ---------------------------
    <DIV style="DISPLAY: none; VISIBILITY: hidden">no items added

    <DIV></DIV></DIV>

    <DIV>

    <DIV style="WIDTH: 140px; FLOAT: left">Base 0.00</DIV><SPAN style="COLOR: orange; CURSOR: pointer" onclick="deleting(this,'Base-0_00');this.parentNode.removeChild(this.parentNode.firstChild);this.parentNode.removeChild(this.pare ntNode.firstChild);this.parentNode.removeChild(this.parentNode.firstChild);costupdate();">

    <DIV style="FLOAT: right"><IMG src="http://www.actionclimbingframes.com/Action-3D/remove.png"></DIV></SPAN></DIV>
    ---------------------------
    OK
    ---------------------------

  11. #11
    Join Date
    Sep 2009
    Location
    oxfordshire, england
    Posts
    210
    it is this part I want to remove completly:
    <DIV style="FLOAT: right"><IMG src="http://www.actionclimbingframes.com/Action-3D/remove.png"></DIV>

    and also this part:
    style="WIDTH: 140px; FLOAT: left"

    but it must remove all mentions of it not only one as that innerhtml is duplicated for every component I load into my application

  12. #12
    Join Date
    Mar 2012
    Location
    Saint-Petersburg, Russia
    Posts
    97
    You see, FLOAT is capitalisized, so "i" flag is necessary ("float" do not match "FLOAT" without it).

    And now - do you mean you want to replace such fragments with different contents (links etc.) inside?

    Then it looks you are trying to perform something bit tricky.

    But what for do you need this replacement? If you want to remove those elements from the web page you are viewing, you'd better remove them from DOM, not from innerHTML... However you would need to explain criteria by which you select which elements should be removed. I suppose jQuery allows finding such elements easy enough.

    Code:
    $("*[style|=float]").remove(); // for example
    Last edited by RodionGork; 03-05-2012 at 09:24 AM.

  13. #13
    Join Date
    Sep 2009
    Location
    oxfordshire, england
    Posts
    210
    I see, and I am just trying to remove not replace. the data is being passed to another file so I need the div elements and image removing from the code. Will using the .remove() work?
    Last edited by simonstaton; 03-05-2012 at 09:44 AM.

  14. #14
    Join Date
    Sep 2009
    Location
    oxfordshire, england
    Posts
    210
    I will try explaining what I am doing to make things a bit clearer.

    When people drag an item into my application it adds it to a "checkout box" (div1)

    When they submit a form on the page the function enquires is then ran. this grabs all the info inside div1 and puts it inside a form field. this form field is then sent in the form to a database when the info is displayed elsewhere.

    when displaying the info elsewhere I do not want the remove icon and the floating divs so I am trying to have them removed when the script enquires is ran.

  15. #15
    Join Date
    Sep 2009
    Location
    oxfordshire, england
    Posts
    210
    If anyone else can give any advice it would be much appreciated as it seems that rodion has gone offline

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles