Clever Geek Handbook

AJAX issues in WebKit browsers

I am developing an AJAX site. So the problem is that browsers (Safari, Chrome) don't display spaces in the AJAX loaded HTML content after tags like Strong, Em, etc.

Then I added the doctype to the AJAX output. Everything was fine, there were all gaps, unless I tested the site in WebKit browsers. When I loaded the page in Safari I got an error:

This page contains the following errors:

error at line 1 at column 7: internal error

Below is the rendering of the page before the first error.

What should I do? Or, in other words, is there a way to infer the doctype for WebKit without getting an error?

The result looks something like this:

<div class="topic">
    <div class="colon">
        <div class="topictext">
            <h2><a href="/artikul/1" class="showhuman" id="1" onclick="showhumaninfo (1); return false;">KirillTitov</a> tells us:</h2><p>Here you go.<br/>
<b>Bold text</b> <i>italic text</i> <strike>etc</strike>…</p> 
            </div><!-- topictext -->
            <div class="topicright"></div>
            <div class="clear"></div>
            <div class="topicinfo">
            <div class="topicclock">
                <font title="Timestamp for geeks — 1253816398">24&#0160;september,&#0160;year&#0160;2009</font>
            </div><!-- topicclock -->
            <div class="topiccomment">
                <a href="/joindachat/2" class="entertopic" id="2" onclick="entertopic (2); return false;">Go inside</a> (: 0)
            </div><!-- topiccomment -->
        </div><!-- topicinfo -->
        <div class="topicindex">
            <img src="/img/bgtopicindex.gif" border="0" alt="" />
        </div><!-- topicindex -->
        <div class="blur"></div>
    </div><!-- colon -->
    <div class="colon">
        <div class="indextopcomment">
            <div class="commenttopleft"><img src="/img/bgcommentindexgreen.gif" alt="" border="0" /></div>
            <div class="texttopcomment nonenew">
                No comments here.
            </div>
            <div class="clear"></div>
            </div><!-- indextopcomment -->
            </div><!-- colon -->
            <div class="clear"></div>
        </div><!-- topic -->
    <div class="clear"></div>
</div><!-- topic -->
+2


source to share


1 answer


Have you thought about using in these places? &nbsp;

Also, try the following for your incoming ajax result:



.Replace("\xA0", "&nbsp;").Replace("\x20","&nbsp;");

Some frameworks behave oddly in webkit and put custom spacing, what do you see? Follow up if replacement works, if no other options are available, but this is usually the easiest / fastest fix. Here's a full table on the odd quirks , but it depends on the browser / platform you usually shoot against.

+4


source






More articles:


All Articles