ajax 양식을 통해 wmd 편집기 (jquery 버전)

나는 ajax를 통해 wmd 편집기를 사용하고 있습니다. 여기가 아약스없이 아주 좋은 일 GitHub의ajax 양식을 통해 wmd 편집기 (jquery 버전)

에 오픈 라이브러리 포크를 기반으로하는 bugged code

WDM 코드가있다.

하지만 편집기가 아약스 양식을 표시하려고 할 때로드되지 않습니다.

<div id="wmd-container"> 
     <div id="wmd-button-bar"></div> 
     <div id="wmd-button-bar-0" class="wmd-button-bar"><ul class="wmd-button-row"><li style="background-position: 0px 0px;" title="Strong &lt;strong&gt; Ctrl+B" class="wmd-button wmd-bold-button"></li><li style="background-position: -20px 0px;" title="Emphasis &lt;em&gt; Ctrl+I" class="wmd-button wmd-italic-button"></li><li class="wmd-spacer"></li><li style="background-position: -40px 0px;" title="Hyperlink &lt;a&gt; Ctrl+L" class="wmd-button wmd-link-button"></li><li style="background-position: -60px 0px;" title="Blockquote &lt;blockquote&gt; Ctrl+Q" class="wmd-button wmd-quote-button"></li><li style="background-position: -80px 0px;" title="Code Sample &lt;pre&gt;&lt;code&gt; Ctrl+K" class="wmd-button wmd-code-button"></li><li style="background-position: -100px 0px;" title="Image &lt;img&gt; Ctrl+G" class="wmd-button wmd-image-button"></li><li class="wmd-spacer"></li><li style="background-position: -120px 0px;" title="Numbered List &lt;ol&gt; Ctrl+O" class="wmd-button wmd-olist-button"></li><li style="background-position: -140px 0px;" title="Bulleted List &lt;ul&gt; Ctrl+U" class="wmd-button wmd-ulist-button"></li><li style="background-position: -160px 0px;" title="Heading &lt;h1&gt;/&lt;h2&gt; Ctrl+H" class="wmd-button wmd-heading-button"></li><li style="background-position: -180px 0px;" title="Horizontal Rule &lt;hr&gt; Ctrl+R" class="wmd-button wmd-hr-button"></li><li class="wmd-spacer"></li><li style="background-position: -200px -20px;" title="Undo - Ctrl+Z" class="wmd-button wmd-undo-button"></li><li style="background-position: -220px -20px;" title="Redo - Ctrl+Shift+Z" class="wmd-button wmd-redo-button"></li><li style="background-position: -240px 0px;" class="wmd-button wmd-help-button"><a title="WMD website" target="_blank" href="http://wmd-editor.com/"></a></li></ul></div><div id="wmd-button-bar-2" class="wmd-button-bar"></div><div id="wmd-button-bar-4" class="wmd-button-bar"></div><textarea id="wmd-input" class="resizable" name="post-text" cols="92" rows="15" tabindex="101"></textarea><div id="wmd-preview-4" class="wmd-preview"></div><div id="wmd-preview-2" class="wmd-preview"></div><div id="wmd-preview-0" class="wmd-preview"></div> 
     </div>

아약스 양식 :

<div id="wmd-container"> 
     <div id="wmd-button-bar"></div> 
     <div id="wmd-button-bar-1" class="wmd-button-bar"></div><div id="wmd-button-bar-3" class="wmd-button-bar"></div><textarea id="wmd-input" class="resizable" name="post-text" cols="92" rows="15" tabindex="101"></textarea><div id="wmd-preview-3" class="wmd-preview"></div><div id="wmd-preview-1" class="wmd-preview"></div> 

     </div>

도움

비 아약스 버전이 HTML을 생산?

출처

2009-12-18 Davide Barison

소스 또는 DOM을보고 계십니까? AJAX는 소스를 보는 경우 나타나지 않는 DOM에 물건을 추가합니다. – Skilldrick

DOM을 보려면 Firebug 또는 Chrome Inspect 요소를 사용하십시오. – Skilldrick

나는 ajax 요청 후에 생성 된 소스 코드를 보았다. –

여러 텍스트 영역에 사용할 수있는 버전을 사용하고 있습니다. 이 컨트롤은 다음을 호출하여 시작됩니다 :

setup_wmd({ 
    "input": "user_about", 
    "button_bar": "user_about-button-bar", 
    "preview": "user_about-preview" 
});

페이지가 완전히로드 될 때 그에만로드 있도록 에디터는 "로드"에 이벤트 리스너를 사용하여로드하는 문제의 ID입니다. ajax 양식이로드되면 페이지가 이미로드되어 있으므로이 이벤트가 실행되지 않습니다. '

방법에있어서 해결

라인 교체 util.startEditor : 당신은에 상단에이 줄을 추가 할 수 있습니다

if (ajaxForm) { 
    loadListener(); //this loads the editor immediately 
} else { 
    util.addEvent(top, "load", loadListener); 
}

:이 같은 뭔가

util.addEvent(top, "load", loadListener);

을 변경 섹션

var ajaxForm = wmd_options.ajaxForm || false

그래서 즉시 편집기를로드하는 데이 방법을 호출 할 수 있습니다

그래서 당신은 지금 편집기를로드하는 아약스 요청을로드 한 후이 메서드를 호출 할 수 있습니다.

출처

2010-03-19 06:17:03 jarrold

당신이 말하는 여러 텍스트 영역 버전은 어디에 있습니까? – cowgod

ajax 양식을 통해 wmd 편집기 (jquery 버전)

답변

관련 문제