הבדלים בין גרסאות בדף "עריכת טקסט מסומן"

מתוך וויקי
קפיצה אל: ניווט, חיפוש
שורה 5: שורה 5:
 
1) להשתמש בדרך הפשוטה של הוספת תג פותח בסוף ה-textarea (ע"י לחיצה על כפתור) שהמשתמש יכניס טקסט ושיסגור את התג ע"י לחיצה על כפתור נוס. כך תיראה הפונקציה:
 
1) להשתמש בדרך הפשוטה של הוספת תג פותח בסוף ה-textarea (ע"י לחיצה על כפתור) שהמשתמש יכניס טקסט ושיסגור את התג ע"י לחיצה על כפתור נוס. כך תיראה הפונקציה:
  
[code]
+
<pre class="code">
 
+
function addTags(tag,textAreaId)
function addTags(tag,textAreaId){
+
{
 
+
  document.getElementById(textAreaId+""),value+=tag
document.getElementById(textAreaId+""),value+=tag
 
 
 
 
}
 
}
 
+
</pre>
[code]
 
  
 
'''יתרון:'''- פשוט ועובד בכל הדפדפנים בלי שינוי בקוד
 
'''יתרון:'''- פשוט ועובד בכל הדפדפנים בלי שינוי בקוד
שורה 21: שורה 18:
 
2) שימוש באובייקט ה-Selection של IE ובשלושה תכונות של textarea הנתמכות רק במוזילה(NS6 ומעלה). ע"י שימוש בנ"ל אנו יכולים לתת למשתמש אפשרות לסמן טקסט מסויים ואז לעטוף אותו בתגיות העיצוב שהמשתמש בחר או שהמשתמש פשוט יכתוב בין תגית הפתיחה והסגירה שהוספנו אוטומטית ל-textarea. הפונקציה תיראה כך:
 
2) שימוש באובייקט ה-Selection של IE ובשלושה תכונות של textarea הנתמכות רק במוזילה(NS6 ומעלה). ע"י שימוש בנ"ל אנו יכולים לתת למשתמש אפשרות לסמן טקסט מסויים ואז לעטוף אותו בתגיות העיצוב שהמשתמש בחר או שהמשתמש פשוט יכתוב בין תגית הפתיחה והסגירה שהוספנו אוטומטית ל-textarea. הפונקציה תיראה כך:
  
[code]
+
<pre class="code">
function addtoForm(openTag, closeTag, textAreaId){ /// Add tags code to textarea
+
function addtoForm(openTag, closeTag, textAreaId)
 
+
{
var txtAr = document.getElementById(""+textAreaId), oRange
+
  // Add tags code to textarea
 
+
  var txtAr = document.getElementById(""+textAreaId), oRange
txtAr.focus()
+
  txtAr.focus()
  
if (document.selection && document.selection.createRange){
+
  if (document.selection && document.selection.createRange)
 +
  {
 +
    oRange=document.selection.createRange();
 +
   
 +
    /// Create Range object form the selected Text
 +
    if (oRange.parentElement()==txtAr)
 +
    {
 +
      // Check if the parent of the Range object is our textarea
 +
      oRange.text= openTag+oRange.text+closeTag /// add the tags before and after the selected text 
 +
    }
 +
  }
 +
  else if(MOZ)
 +
  {
 +
    var txtLength = parseInt(txtAr.textLength) // fint the length of the selected text
 +
    var selStart=txtAr.selectionStart  /// find the start position
 +
    var selEnd=txtAr.selectionEnd /// find the end position
  
oRange=document.selection.createRange();  /// Create Range object form the selected Text
+
    if (selEnd==2 || selEnd==1)
 +
    {
 +
      selEnd=txtLength
 +
    }
  
if (oRange.parentElement()==txtAr){  /// Check if the parent of the Range object is our textarea
+
    var sect1 = (txtAr.value).substring(0,selStart) // text before the selected text
 
+
    var sect2 = (txtAr.value).substring(selStart,selEnd) // the selected text
oRange.text= openTag+oRange.text+closeTag /// add the tags before and after the selected text
+
    var sect3 = (txtAr.value).substring(selEnd,txtLength) // text after the selected  
 
 
}
 
 
 
}else if(MOZ){
 
 
 
var txtLength = parseInt(txtAr.textLength) // fint the length of the selected text
 
 
 
var selStart=txtAr.selectionStart  /// find the start position
 
 
 
var selEnd=txtAr.selectionEnd /// find the end position
 
 
 
if (selEnd==2 || selEnd==1){
 
 
 
selEnd=txtLength
 
 
 
}
 
 
 
var sect1 = (txtAr.value).substring(0,selStart) /// text before the selected text
 
 
 
var sect2 = (txtAr.value).substring(selStart,selEnd) // the selected text
 
 
 
var sect3 = (txtAr.value).substring(selEnd,txtLength) /// text after the selected  
 
 
text
 
text
txtAr.value = sect1+openTag+sect2+closeTag+sect3  /// add the tags before and after the selected text
 
 
txtAr.focus()
 
  
}else{
+
    txtAr.value = sect1+openTag+sect2+closeTag+sect3  // add the tags before and after the selected text
  
return (alert("your browser is not supported by us\ only Mozilla(NS6 & higher) AND IE\n thanks"),false)
+
    txtAr.focus()
}
 
  
 +
  }
 +
  else
 +
  {
 +
    return (alert("your browser is not supported by us\ only Mozilla(NS6 & higher) AND IE\n thanks"),false)
 +
  }
 
}
 
}
[code]
+
</pre>
  
 
בהצלחה :-)
 
בהצלחה :-)

גרסה מ־21:51, 12 ביולי 2004

עריכת טקסט מסומן מ-textarea

לא פעם קורה שאנחנו רוצים לאפשר למשתמש באתר (במסגרת הודעות בפורומים וכדומה) לעצב את הטקסט הנשלח. יש לנו כמה אפשרויות כדי לבצע את זה:

1) להשתמש בדרך הפשוטה של הוספת תג פותח בסוף ה-textarea (ע"י לחיצה על כפתור) שהמשתמש יכניס טקסט ושיסגור את התג ע"י לחיצה על כפתור נוס. כך תיראה הפונקציה:

function addTags(tag,textAreaId)
{
  document.getElementById(textAreaId+""),value+=tag
}

יתרון:- פשוט ועובד בכל הדפדפנים בלי שינוי בקוד

חיסרון: - יכול להיות שהמשתמש לא יסגור תגיות .

2) שימוש באובייקט ה-Selection של IE ובשלושה תכונות של textarea הנתמכות רק במוזילה(NS6 ומעלה). ע"י שימוש בנ"ל אנו יכולים לתת למשתמש אפשרות לסמן טקסט מסויים ואז לעטוף אותו בתגיות העיצוב שהמשתמש בחר או שהמשתמש פשוט יכתוב בין תגית הפתיחה והסגירה שהוספנו אוטומטית ל-textarea. הפונקציה תיראה כך:

function addtoForm(openTag, closeTag, textAreaId)
{
  // Add tags code to textarea
  var txtAr = document.getElementById(""+textAreaId), oRange
  txtAr.focus()

  if (document.selection && document.selection.createRange)
  {
    oRange=document.selection.createRange(); 
    
    /// Create Range object form the selected Text
    if (oRange.parentElement()==txtAr)
    {
      // Check if the parent of the Range object is our textarea
      oRange.text= openTag+oRange.text+closeTag /// add the tags before and after the selected text   
    }
  }
  else if(MOZ)
  {
    var txtLength = parseInt(txtAr.textLength) // fint the length of the selected text
    var selStart=txtAr.selectionStart   /// find the start position
    var selEnd=txtAr.selectionEnd /// find the end position

    if (selEnd==2 || selEnd==1)
    {
      selEnd=txtLength
    }

    var sect1 = (txtAr.value).substring(0,selStart) // text before the selected text
    var sect2 = (txtAr.value).substring(selStart,selEnd) // the selected text
    var sect3 = (txtAr.value).substring(selEnd,txtLength) // text after the selected 
text

    txtAr.value = sect1+openTag+sect2+closeTag+sect3  // add the tags before and after the selected text

    txtAr.focus()

  }
  else
  {
    return (alert("your browser is not supported by us\ only Mozilla(NS6 & higher) AND IE\n thanks"),false)
  }
}

בהצלחה :-)