Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [JavaScript]Dynamiczne dodawanie
maki1234
post
Post #1





Grupa: Zarejestrowani
Postów: 36
Pomógł: 0
Dołączył: 16.01.2015

Ostrzeżenie: (0%)
-----


Witam, Piszę skrypty w PHP, toteż w JS jestem zielony jak trawka na wiosnę (IMG:style_emoticons/default/wink.gif)

Tworzę sobie właśnie system BBcode i mam takie widzimisie że po naciśnieciu buttona np [img] w polu tekstowym pojawi się gotowy szablon img (nie mogę napisać bo nie przjmie skrypt dodawania postów, ale chyba każdy wie jak to wygląda)
(identycznie jak przy tworzeniu na tym forum nowego tematu zaznaczając jaka kategoria np PHP to dodaje do tematu tag (IMG:style_emoticons/default/biggrin.gif) . Mniemam że to właśnie w JS można takie coś osiągnąc. Jak już wyżej wspomniałem jestem w JS zielony, są jakieś gotowe rozwiązania? Nakierujecie coś koledzy?

Pozdro!
Go to the top of the page
+Quote Post
 
Start new topic
Odpowiedzi
maki1234
post
Post #2





Grupa: Zarejestrowani
Postów: 36
Pomógł: 0
Dołączył: 16.01.2015

Ostrzeżenie: (0%)
-----


Z JS nie wiem za bardzo nic, mógłbyś podać jakiś przykład jeśli wiesz jak to zrobić?

Ogarnąłem takie coś, ale nie działa wie ktoś w czym tkwi problem? (kod nie mój!)

Kod
<!DOCTYPE HTML>

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Text editor</title>
    <link rel="stylesheet" type="text/css" href="style.css" />
    
    <script type="text/javascript">
        function view_text () {
            // Find html elements.
            var textArea = document.getElementById('my_text');
            var div = document.getElementById('view_text');
            
            // Put the text in a variable so we can manipulate it.
            var text = textArea.value;
            
            // Make sure html and php tags are unusable by disabling < and >.
            text = text.replace(/\</gi, "<");
            text = text.replace(/\>/gi, ">");
            
            // Exchange newlines for <br />
            text = text.replace(/\n/gi, "<br />");
            
            // Basic BBCodes.
            text = text.replace(/\[b\]/gi, "<b>");
            text = text.replace(/\[\/b\]/gi, "</b>");
            
            text = text.replace(/\[i\]/gi, "<i>");
            text = text.replace(/\[\/i\]/gi, "</i>");
            
            text = text.replace(/\[u\]/gi, "<u>");
            text = text.replace(/\[\/u\]/gi, "</u>");
            
            // Print the text in the div made for it.
            div.innerHTML = text;
        }
        
        function mod_selection (val1,val2) {
            // Get the text area
            var textArea = document.getElementById('my_text');
            
            // IE specific code.
            if( -1 != navigator.userAgent.indexOf ("MSIE") ) {
                
                var range = document.selection.createRange();
                var stored_range = range.duplicate();
                
                if(stored_range.length > 0) {
                    stored_range.moveToElementText(textArea);
                    stored_range.setEndPoint('EndToEnd', range);
                    textArea.selectionstart = stored_range.text.length - range.text.length;
                    textArea.selectionend = textArea.selectionstart + range.text.length;
                }
            }
            // Do we even have a selection?
            if (typeof(textArea.selectionstart) != "undefined") {
                // Split the text in three pieces - the selection, and what comes before and after.
                var begin = textArea.value.substr(0, textArea.selectionstart);
                var selection = textArea.value.substr(textArea.selectionstart, textArea.selectionend - textArea.selectionstart);
                var end = textArea.value.substr(textArea.selectionend);
                
                // Insert the tags between the three pieces of text.
                textArea.value = begin + val1 + selection + val2 + end;
            }
        }
    </script>
    
    
</head>
<body>
    
    <!-- Knapper -->
    <input type="button" value="B" onclick="mod_selection('[b]','[/b]')" />
    <input type="button" value="I" onclick="mod_selection('[i]','[/i]')" />
    <input type="button" value="U" onclick="mod_selection('[u]','[/u]')" />
    <br />
    
    <!-- Text area -->
    <textarea class="text_edit" id="my_text"></textarea>
    <br />
    
    <!-- Submit button -->
    <input type="button" value="Show text" onclick="view_text()" />
    
    <!-- Empty div to put the text in -->
    <div id="view_text">
    </div>

</body>
</html>
Go to the top of the page
+Quote Post

Posty w temacie


Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Aktualny czas: 16.10.2025 - 01:50