識別不同文本區域的光標位置，並在列表框中選擇項目時插入文本

任何人都可以幫助我嗎？識別不同文本區域的光標位置，並在列表框中選擇項目時插入文本

我有一個.aspx頁面設計了兩個文本區域控件和一個列表框控件。

<td> 
    <p>Base Entity Attributes</p> 
    <select name="drop1" id="SelectGroupApiS" size="4"> 
    </select> 
</td> 
<td> 
    <p>REQUEST XML</p> 
    <textarea id="txtAreaRequest" rows="" cols=""></textarea> 
</td> 
<td> 
    <p>RESPONSE XML</p> 
    <textarea id="txtAreaResponse" rows="" cols=""></textarea> 
</td>

當我點擊任何一個列表框的項目我做了列表項的當前文本使用jQuery是在文本區。但我希望文本位於包含光標位置的文本框中。目前我做成單個文本框。我現在想要在包含光標位置的兩個文本框之一中顯示文本。

如何使它發生？

幫助我PLSS

來源

2012-11-03 Nanda

通過「光標位置」我想你指的焦點，對不對？ –

我剛剛將選定列表項目的文本插入到單個textarea中，就像$（「＃txtArea1」）。insertAtCaret（$（'＃lis> option：selected'）。text（））;但現在我希望它像（txtArea1.gotfocus（））{insert to txtare1} else if（txtArea2.gotfocus（））{insert to txtarea 2} – Nanda

@roasted獲得lastfocus的文本框需要單擊項目時插入的文本在列表框中。在頁面載入時，最初的焦點必須設置爲任何一個文本框？ – Nanda

小提琴http://jsfiddle.net/tariqulazam/LBkcV/

HTML

<td> 
    <p>Base Entity Attributes</p> 
    <select name="drop1" id="SelectGroupApiS" size="4"> 
     <option value="volvo">Volvo</option> 
    <option value="saab">Saab</option> 
    <option value="mercedes">Mercedes</option> 
    <option value="audi">Audi</option> 
    </select> 
</td> 
<td> 
    <p>REQUEST XML</p> 
    <textarea id="txtAreaRequest" class="tarea" rows="" cols=""></textarea> 
</td> 
<td> 
    <p>RESPONSE XML</p> 
    <textarea id="txtAreaResponse" class="tarea" rows="" cols=""></textarea> 
</td>

的JavaScript

var activeArea; 
$(document).ready(function(){ 
    activeArea = $("#txtAreaRequest"); 
}); 
$(".tarea").click(function(){ 
    activeArea = $(this); 
}).focus(function(){ 
    activeArea = $(this); 
}); 

$("#SelectGroupApiS").change(function(){ 
    $(activeArea).append($("#SelectGroupApiS option:selected").val());  
});

來源

2012-11-03 12:02:20 Tariqulazam

工作。非常感謝：） – Nanda

一個可能的解決方案是有一個句柄上lsit項目時，點擊最後不得不關注並使用該手柄textarea的。

即像

var $focusTA = null; 
$('textarea').focus(function() { 
    $focusTA = $(this); 
});

和設置文本做

$focusTA.insertAtCaret($('#lis>option:selected').text());

。

來源

2012-11-03 11:58:40 techfoobar

謝謝你的答案隊友試了一下，但沒有解決。無論如何非常感謝您的回答 – Nanda

如果我正確理解你的問題，你可以做這樣的事情：

$(document).ready(function(){$('#txtAreaRequest').focus()}); 

var dataTB = []; 
$('textarea').blur(function() { 
    dataTB[0] = this; 
    dataTB[1] = getCaret(this); 
}); 

$('#SelectGroupApiS').change(function() { 
    var valTB = $(dataTB[0]).val(); $(dataTB[0]).val(valTB.substring(0,dataTB[1])+$('option:selected',this).text()+valTB.substring(dataTB[1])); 

}); 



function getCaret(node) { 
    if (node.selectionStart) { 
     return node.selectionStart; 
    } else if (!document.selection) { 
     return 0; 
    } 

    var c = "\001", 
     sel = document.selection.createRange(), 
     dul = sel.duplicate(), 
     len = 0; 

    dul.moveToElementText(node); 
    sel.text = c; 
    len = dul.text.indexOf(c); 
    sel.moveStart('character', -1); 
    sel.text = ""; 
    return len; 
}

見http://jsfiddle.net/mcDhE/

來源

2012-11-03 12:05:04

識別不同文本區域的光標位置，並在列表框中選擇項目時插入文本

回答

相關問題