如何修改此腳本以使用基於ID的不同替換陣列？

我在下面有這個腳本。我想要做的是修改它，以便它根據document.getElementById（'something'）是什麼使用一組不同的替換值。如何修改此腳本以使用基於ID的不同替換陣列？

所以（ '標題'）將提前

function DeGlyph(element) { 
// List of replacement rules. 
    replacements= [ 
     //Single Quote Characters 
     ['\u0027', '\''], 
     ['\u2018', '\''], 
     ['\u2019', '\''], 
     ['\u201A', '\''], 
     ['\u201B', '\''], 
     //Double Quote Characters 
     ['\u0022', '"'], 
     ['\u201C', '"'], 
     ['\u201D', '"'], 
     ['\u201E', '"'], 
     ['\u201F', '"'], 
     ['\u301D', '"'], 
     ['\u301E', '"'], 
     ['\u301F', '"'], 
     //Other Characters  
     ['\u00BC', '1/4'], 
     ['\u00BD', '1/2'], 
     ['\u00BE', '3/4'], 
     ['\u2122', '<sup>TM</sup>'],   
     ['\u2013', '-'], 
     ['\u2014', '&mdash;'], 
     ['\u00A9', '&copy;'], 
     ['\u00AE', '&reg;']   


    ]; 


// Only attempt to use replacer behaviour if we can retain the cursor 
// position. Setting value by default moves the cursor to the end of the 
// input, which is too irritating. 
// 
    if (getInputSelection(element)!==null) { 
     element.onkeyup= function() { 
      value= element.value; 
      for (var i= 0; i<replacements.length; i++) { 
       value= value.split(replacements[i][0]).join(replacements[i][1]); 
      } 
      if (value!=element.value) { 
       var s= getInputSelection(element); 
       element.value= value; 
       setInputSelection(element, s); 
      } 
     }; 
    } 
} 

// Cross-browser (as much as possible anyway) cursor positioning 
// 
function getInputSelection(element) { 
    if (element.selectionStart!==window.undefined) { 
     return [element.selectionStart, element.selectionEnd]; 
    } else if (document.selection) { 
     var BIG= 1000000; 
     var range= document.selection.createRange(); 
     if (range.moveStart===window.undefined) 
      return [0, 0]; 
     var start= -range.moveStart('character', -BIG); 
     var end= -range.moveEnd('character', -BIG); 
     return [start-1, end-1]; 
    } else return null; 
} 
function setInputSelection(element, s) { 
    if (element.selectionStart!==window.undefined) { 
     element.selectionStart= s[0]; 
     element.selectionEnd= s[1]; 
    } else if (document.selection) { 
     var range= element.createTextRange(); 
     range.collapse(true); 
     range.moveEnd('character', s[1]); 
     range.moveStart('character', s[0]); 
     range.select(); 
    } 
} 

new DeGlyph(document.getElementById('Headline')); 
new DeGlyph(document.getElementById('Body'));

來源

2012-10-11 rg35

爲什麼不將數組作爲變量傳遞，而不是編碼切換到函數本身的邏輯？ –

哇...那麼jQuery在哪裏？：P – SpYk3HH

嗯

由於使用一套不同的替換字符的（ '主體'），等等，這是一些 '有趣' - 就像克里斯說的那樣，只需要將函數作爲你想要使用的替換數組，而不是對它進行硬編碼。

這是一個簡單的事情（一）altereing查找表的格式有點（b）改變功能的簽名爲DeGlyph包括並稱計算瓦爾功能的替代陣列（C）傳遞給DeGlyph。

試試這個大小（是否需要選擇輸入中的文本，除了失去，然後重新集中在瀏覽器窗口更新？我認爲這是不工作，直到我選擇原始文本，然後做alt在瀏覽器和另一個程序之間來回切換）

<!DOCTYPE html> 
<html> 
<head> 
<script> 

var mArray = 
    [ 
     { 
        forId : 'headline', 
      replacements : [ 
           //Single Quote Characters 
           ['\u0027', '\''], 
           ['\u2018', '\''], 
           ['\u2019', '\''], 
           ['\u201A', '\''], 
           ['\u201B', '\''] 
          ] 
     }, 


     { 
        forId : 'body', 
      replacements : [ 
           ['\u0022', '"'], 
           ['\u201C', '"'], 
           ['\u201D', '"'], 
           ['\u201E', '"'], 
           ['\u201F', '"'], 
           ['\u301D', '"'], 
           ['\u301E', '"'], 
           ['\u301F', '"'] 
          ] 
     }, 

     { 
        forId : 'mTest', 
      replacements : [ 
           ['1', 'one'], 
           ['2', 'two'], 
           ['3', 'three'], 
           ['4', 'four'], 
           ['5', 'five'] 
          ] 
     } 
    ]; 




function mDeGlyph(idStr, mDataBank) 
{ 
    var element = document.getElementById(idStr); 
    if (element == null) 
    { 
     alert('no element with that id="'+idStr+'" found'); 
     return; 
    } 
    var i, n = mDataBank.length, replacements, found=false; 
    for (i=0; i<n; i++) 
    { 
     if (mDataBank[i].forId == idStr) 
     { 
      replacements = mDataBank[i].replacements; 
      found = true; 
      break; 
     } 
    } 
    if (found == true) 
    { 
     DeGlyph(element, replacements); 
    } 
    else 
     alert("no apparent entry for that id-string"); 
} 


function DeGlyph(element, replacements) 
{ 
// Only attempt to use replacer behaviour if we can retain the cursor 
// position. Setting value by default moves the cursor to the end of the 
// input, which is too irritating. 
// 
    if (getInputSelection(element)!==null) { 
     element.onkeyup= function() { 
      value= element.value; 
      for (var i= 0; i<replacements.length; i++) { 
       value= value.split(replacements[i][0]).join(replacements[i][1]); 
      } 
      if (value!=element.value) { 
       var s= getInputSelection(element); 
       element.value= value; 
       setInputSelection(element, s); 
      } 
     }; 
    } 
} 

// Cross-browser (as much as possible anyway) cursor positioning 
// 
function getInputSelection(element) { 
    if (element.selectionStart!==window.undefined) { 
     return [element.selectionStart, element.selectionEnd]; 
    } else if (document.selection) { 
     var BIG= 1000000; 
     var range= document.selection.createRange(); 
     if (range.moveStart===window.undefined) 
      return [0, 0]; 
     var start= -range.moveStart('character', -BIG); 
     var end= -range.moveEnd('character', -BIG); 
     return [start-1, end-1]; 
    } else return null; 
} 
function setInputSelection(element, s) { 
    if (element.selectionStart!==window.undefined) { 
     element.selectionStart= s[0]; 
     element.selectionEnd= s[1]; 
    } else if (document.selection) { 
     var range= element.createTextRange(); 
     range.collapse(true); 
     range.moveEnd('character', s[1]); 
     range.moveStart('character', s[0]); 
     range.select(); 
    } 
} 

// just displays the list of repoklacements that we have for assorted ids. 
function mInit() 
{ 

// mDeGlyph('Headline'); 
// mDeGlyph('Body'); 
    mDeGlyph('mTest', mArray); 
} 


</script> 
<style> 

</style> 
</head> 
<body onload='mInit();'> 
    <input id='mTest' value='1 3 5' /> 
</body> 
</html>

來源

2012-10-11 21:04:15 enhzflep

如何修改此腳本以使用基於ID的不同替換陣列？

回答

相關問題