Вставка текста в текстовое поле при нажатии на класс div

Question

Я создаю эту систему отправки прямо сейчас. Я хочу создать его так, чтобы он вставлял какой-то текст (например, [b][/b]) при нажатии на div. Это образец мы работаем с:

<div class="insertBBC" title="Bold Text" onClick="moveNumbers([b][/b])" id="bold"> 
         <p>B</p>  
        </div> 
        <div class="insertBBC" title="Italic Text"> 
         <p>I</p> 
        </div> 
        <div class="insertBBC" title="Bullet Points"> 
         <p>BP</p> 

и т.д ...
Я также хочу, поэтому, когда есть уже содержание в текстовое поле, он не будет удалить что-нибудь оттуда, кроме того, он должен добавьте теги [b][/b], где находился курсор. И когда текст будет выбран, он поместит тег [b] напротив и тэг [/ b] на задней панели. Вид как BBC Работы. Я понятия не имею, как я могу добиться этого, я долгое время изучал, я вижу, что люди говорят об этом только с помощью JQuery, и я не знаю JQuery или JS еще так, да .. I 'd избегать этого если возможно.

Кроме того, это текстовые поля. Их два, и я хочу вставить их в активную.

<br><textarea name="newPost" placeholder="Post Preview(Will Be Displayed on the Index Page)" cols="100" rows="10"/></textarea><br> 
<br><textarea name="newPostPreview" placeholder="Post Text" cols="100" rows="10"/></textarea> 

Любые провода? Спасибо :)

Answer 1

К сожалению, ваш единственный вариант - использовать jQuery или Javascript (или другую библиотеку на стороне браузера). PHP использует только серверный код и может выплевывать поля html, которые вы хотите использовать, но не может взаимодействовать с элементами после загрузки страницы в браузер.

Я могу сообщить, как использовать jQuery, но только то, что это стоит того, чтобы начать изучать его сейчас. С ним легко справляться, поэтому не пугайтесь.

Вот что я хотел бы предложить, чтобы начать работу: Загрузка самую последнюю библиотеку JQuery, используя этот тег:

<script src="http://code.jquery.com/jquery-latest.js"></script> 

Тогда вы предназначаться соответствующие кнопки и сделать что-то, когда они нажимали на:

$("#boldButtonID").click(function(){ 
    //get the index of the cursor 
    //select the word that the cursor is on by stopping at the space (" ") character in either direction, then insert [b] and [/b] in the appropriate locations. 
} 

Вы также можете получить текст, который выбирается с помощью этой функции, которую я получил здесь: Get the Highlighted/Selected text

function getSelectionText() { 
var text = ""; 
if (window.getSelection) { 
    text = window.getSelection().toString(); 
} else if (document.selection && document.selection.type != "Control") { 
    text = document.selection.createRange().text; 
} 
return text; 
} 

Затем вы можете использовать функции .before() .html ("[b]") и .after(). Html ("[/ b]"), чтобы разместить свои теги там, где вам нужно.

Я надеюсь, что это поможет пролить свет на то, что вам нужно будет сделать.

Cheers!