2011-05-28 48 views
0

我正在爲tinyMCE添加一個按鈕,並且我想知道如何使用javascript將標籤內部的文本封裝在標籤中(例如,這種突出顯示的文本被包裝在[highlight][/highlight]標籤中)。 並且現在整個tinymcejavascript wrap with text標籤

(function() { 
tinymce.create('tinymce.plugins.shoutButton', { 
    init : function(ed, url) { 
     ed.addButton('shout.button', { 
      title : 'shout.button', 
      image : 'viral.gif', 
      onclick : function() { 
       window.alert("booh"); 
     }); 
    }, 
    createControl : function(n, cm) { 
     return null; 
    }, 
    getInfo : function() { 
     return { 
      longname : "Shout button", 
      author : 'SAFAD', 
      authorurl : 'http://safadsoft.com/', 
      infourl : 'http://safadsoft.com/', 
      version : "1.0" 
     }; 
    } 
}); 
tinymce.PluginManager.add('shout.button', tinymce.plugins.ShoutButton); 

})();

回答

1

的問題是語法錯誤,不能正常閉合支架和一些失蹤分號,採用的幫助下,真棒Jsfiddle的JSHint和JSLint的我固定它:

(function() { 
    tinymce.create('tinymce.plugins.shoutButton', { 
     init: function (ed, url) { 
      ed.addButton('shout.button', { 
       title: 'shout.button', 
       image: 'viral.gif', 
       onclick: function() { 
        window.alert("booh"); 
       } 
      }); 
      createControl: function (n, cm) { 
       return null; 
      } 
      getInfo: function() { 
       return { 
        longname: "Shout button", 
        author: 'You !', 
        authorurl: 'http://example.com/', 
        infourl: 'http://example.com/', 
        version: "1.0" 
       }; 
      } 
     } 
    }); 
    tinymce.PluginManager.add('shout.button', tinymce.plugins.ShoutButton); 
})(); 

順祝商祺

+2

我投下了你的答案,因爲你沒有發佈實現最終目標的最終代碼。 – Webnet 2012-05-01 19:16:39

+0

同意,爲此我編輯了答案,接受我真誠的道歉! – SAFAD 2013-03-05 10:51:20

2

您可以使用setSelectionRange(mozilla/webkit)或selection.createRange(IE)方法在textarea中查找當前突出顯示的文本。 我在jsfiddle上舉了一個例子,但已經註釋掉了你的正則表達式,因爲它在很多情況下掛起了瀏覽器。你需要使它更具限制性,而且它目前還會傳遞比youtube url更多的其他內容。

但是,該示例提供了一個工作解決方案,用於獲取當前選定的文本,您可以在修復模式後應用於idPattern.exec()。

idPattern = /(?:(?:[^v]+)+v.)?([^&=]{11})(?=&|$)/; 
    // var vidId = prompt("YouTube Video", "Enter the id or url for your video"); 


    var vidId; 
     el = document.getElementById('texty'); 
     if (el.setSelectionRange) { 
     var vidId = el.value.substring(el.selectionStart,el.selectionEnd); 
     } 
     else if(document.selection.createRange()) { 
      var vidId = document.selection.createRange().text; 
     } 

    alert(vidId); 

編輯:包裝突出顯示的文本並將其輸出回元素。 example

el = document.getElementById('texty'); 
    if (el.setSelectionRange) { 

    el.value = el.value.substring(0,el.selectionStart) + "[highlight]" + el.value.substring(el.selectionStart,el.selectionEnd) + "[/highlight]" + el.value.substring(el.selectionEnd,el.value.length); 

    } 
    else if(document.selection.createRange()) { 
     document.selection.createRange().text = "[highlight]" + document.selection.createRange().text + "[/highlight]"; 
    } 
+0

我說這是我在製作按鈕到tinyMCE時發現的一些教程中的一個例子,我想要的只是用高亮標記包裝文本 – SAFAD 2011-05-28 22:32:28

+0

那麼這正是它所做的。它會找到突出顯示的文本供您隨時隨地使用。 – Niklas 2011-05-28 23:19:20

+0

現在找到它後,如何將它包裝在那些[highlight] [/ highlight]標籤下,我很壞@ JS – SAFAD 2011-05-28 23:34:27