Как найти / обнаружить любую текстовую область на странице, используя jQuery?

Question

Я хочу добавить вызов функций на моих страницах с именем enableTinyMCE (); В этой функции я хочу увидеть, есть ли какие-либо текстовые области на моей странице, и если да, то сделать функцию tinyMCE.init (). Как определить, есть ли на странице какие-либо элементы текстовой области?

Answer 1

if( $('textarea').length > 0 ) {
    ...
}

Answer 2

if($('textarea').length > 0) {
    document.write('we have at least one textarea');
}

OR

if($('textarea').length) {
    document.write('we have at least one textarea');
}

Прочтите это из FAQ:

http://docs.jquery.com/Frequently_Asked_Questions#How_do_I_test_whether_an_element_exists.3F

Answer 3

Стоит отметить, что требуемая функциональность может быть реализована самой TinyMCE:

Если вы установите для параметра mode значение textareas в вызове tinyMCE.init (), он автоматически преобразует любые найденные текстовые области в экземпляры редактора. Если нет текстовых полей, он ничего не будет делать, спокойно.

tinyMCE.init({
    ...
    mode : "textareas",
    ...
});

И наоборот, вы можете указать TinyMCE преобразовывать только текстовые области, которые соответствуют имени класса CSS, используя значение specific_textareas в параметре mode.

tinyMCE.init({
   ...
   mode : "specific_textareas",
   editor_selector : "mceEditor"
});

http://wiki.moxiecode.com/index.php/TinyMCE:Configuration/mode

Answer 4

Чтобы расширить на karim79 ответ.

Со страницы jQuery docs : Примечание: не всегда необходимо проверять, существует ли элемент. Следующий код будет показывать элемент, если он существует, и ничего не делать (без ошибок), если он не существует.

Это означает, что вы можете просто сделать:

$(function(){
    $("textarea").each(function(i){
        this.enableTinyMCE();
    })
})

Edit:

На самом деле для этой цели разрабатывается плагин jQuery. Я хотел бы скачать и опробовать плагин и внести свой вклад в его разработку, если вы можете.

JQ-TinyMCE

Answer 5

Селектор jQuery всегда возвращает массив, даже если не найдено подходящих элементов. Это означает, что вам нужно проверить длину. Попробуйте вместо этого.

if($('textarea').length > 0) {    
 document.write('we have at least one textarea');
}

Answer 6

Я сделал следующее, как было предложено, однако я все еще хочу вызывать enableTinyMCE только если на моей странице есть текстовые области. Я не могу вызвать эту функцию в document.ready. Смотрите Google! Есть идеи?

$(function() {

     if ($('textarea').length > 0)
    {
       var data = $('textarea');
       $.each(data, function(i)
       {
         tinyMCE.execCommand('mceAddControl', false, data[i].id);
       }
       );
    }

});

function enableTinyMCE()
{
        tinyMCE.init({
            plugins: 'paste',
            theme_advanced_toolbar_location: 'top',
            theme_advanced_buttons1: 'pastetext,pasteword,copy,cut,separator,bold,italic,underline,separator,bullist,numlist,separator,undo,redo,separator,link,unlink,separator,charmap,separator,formatselect,separator,code',
            theme_advanced_buttons2: '',
            theme_advanced_buttons3: '',
            mode: 'textareas',
            theme: 'advanced',
            theme_advanced_blockformats: 'None=p,Heading 3=h3,Heading 2=h2'
        });
}

tinymce.init нужно вызывать вне documentready, но $ ('textarea'). Длина всегда равна нулю вне documentready. Помогите!

Answer 7

Это моё решение

if ($('textarea').length > 0)
    {
       var data = $('textarea');
       $.each(data, function(i)
       {
         tinyMCE.execCommand('mceAddControl', false, data[i].id);
       }
       );

       $('form').bind('form-pre-serialize', function(e) {
            tinyMCE.triggerSave(true,true);
        });
    }

И чтобы включить tinyMCE, я сделал это

<% if (ViewData["TextAreaVisible"] != null && bool.Parse(ViewData["TextAreaVisible"].ToString()) == true)
   {%>
        <script type="text/javascript" src="../../Scripts/tinymce/tiny_mce.js"></script>
        <script type="text/javascript">
           enableTinyMCE();
        </script>
<%} %>

EnableTinyMCE делает это

function enableTinyMCE() {

    tinyMCE.init({
        plugins: 'paste',
        theme_advanced_toolbar_location: 'top',
        theme_advanced_buttons1: 'pastetext,pasteword,copy,cut,separator,bold,italic,underline,separator,bullist,numlist,separator,undo,redo,separator,link,unlink,separator,charmap,separator,formatselect,separator,code',
        theme_advanced_buttons2: '',
        theme_advanced_buttons3: '',
        mode: 'none',
        theme: 'advanced',
        theme_advanced_blockformats: 'None=p,Heading 3=h3,Heading 2=h2'
    });

}