2009-11-24 10 views
5

私は以下のような問題があります:アプリケーションではリッチテキストエディタ(TinyMCEですが、これは重要ではないと思います)今は、Internet Explorer 8で、我々はあなたがコンテンツに入力するとウェブアドレスのように見えるということに気付きました:Javascript:回避策:hrefを変更するとInternet Explorerがリンクテキストを変更します

www.google.com

... IEは親切に変換いくつかのネイティブツーブラウザー機能によってリンクされています。リンクを作成してリンクのプロパティを編集し、hrefを設定する場合は、

www.google.com/analytics

に...その後javascriptのは、リンク変更のテキストも、アンカータグのhref属性を設定するとき。望ましい結果は次のとおりです。

`<a href="http://www.google.com/analytics">www.google.com</a>` 

が、実際には次のようになります。

`<a href="http://www.google.com/analytics">www.google.com/analytics</a>` 

誰もがこの問題を回避する方法を知っていますか?

更新:この動作はInternet Explorer 8および7でのみ確認されています。Firefox、Chrome、およびSafariは影響を受けません。この問題は、TinyMCEウェブサイトhttp://tinymce.moxiecode.com/examples/full.phpでも確認できます。そのため、おそらくTinyMCEの設定上の問題ではありません。

+0

IE9は同じように動作しますか?私はIE7と8でこの動作を見ていますが、IE9にはアクセスできません。 – Prembo

答えて

8

一部の調査とデバッグの後、Internet Explorerの組み込み動作によって問題が発生していることがわかりました。これは、リンクのhref-propertyを設定するときに発生します。そのテキストコンテンツはURL(IEによる)のように見えます。このような場合、IEはhref属性の内容をリンクテキストにコピーします。

あり、このためのいくつかの回避策も、私は、少なくとも、このロジックが機能することがわかったかもしれません:innerHTML場合は、一時的な変数にinnerHTML

  • いつものようにhref属性を設定

    1. 店元のinnerHTMLを一時変数からコピーし直してください。

    リンクのinnerHTMLを変更してもhref属性が変更されないため、これが機能するようです。

    tinyMCEでは、関数のsetAllAttribs()で次の行を探します。advlinkプラグインのJS:

    setAttrib(elm, 'href', href); 
    

    ...とこの怪物に置き換える:

    if(tinyMCE.isMSIE) { 
        var tmp = elm.innerHTML; 
        setAttrib(elm, 'href', href); 
        if(elm.innerHTML != tmp) // optional, but keeps unnecessary innerHTML set:s away 
         elm.innerHTML = tmp; 
    } 
    else { 
        setAttrib(elm, 'href', href); 
    } 
    

    ...そして、あなたのリンクはそのままかのように表示されます。私もこれについてstarted a thread on the tinyMCE forumsです。彼らが私の解決策にいくつかの改善点を投稿したり、ナンセンスだと言えば、この質問も更新します。

  • 0

    より多くの情報が必要です。

    1. それは他のブラウザでも同じように動作していますか?
    2. これをリッチテキストエリアまたはhtmlビューに入力していますか?
    3. TinyMCEを正しく設定しましたか?特定の実装のバグのように聞こえる - HTMLタグを適切に解析していない。
    +0

    こんにちは、コメントダイアログはマークダウンをサポートしていません。 (1)この問題はInternet Explorerでのみ発生し、バージョン8を試してみました。(2)リッチテキストエリアにテキストを入力していますが、HTMLソースで最初にリンクを作成すると同じですそれを編集します。 (3)私は問題がTinyMCE構成ではないと思う。あなたのサンプルWebサイトで問題を再現することができます:tinymce.moxiecode.com/examples/full.php – Manne

    +0

    私はIE 7で全く同じ動作をします。これはtinyMCEの機能ではないと確信していますか? –

    +0

    私は見る!私はFirefox、Chrome、Safariで試してみましたが、これらの動作はすべて表示されません。これは実際にTinyMCEの「機能」のように思えますが、これは今IEでしか機能しません。私はInternet Explorerが他のテキストエリアでこれをしているのを見ていないので、TinyMCEの「機能」であることはほとんど確信しています。この場合、おそらく設定でそれを無効にする方法があります。彼らの文書を見て、見てください。私は個人的にこれを見たことがなかったが、実際には役に立ちました:) – Joshua

    関連する問題