【问题标题】:3 textboxes, 1 button, on button click put text in the textbox where the cursor is3个文本框,1个按钮,单击按钮将文本放入光标所在的文本框中
【发布时间】:2014-12-18 10:08:26
【问题描述】:

我有 3 个文本框和一个按钮,我需要做的是在按钮上单击我希望文本出现在光标所在的任何文本框中。

我可以为一个文本框做到这一点,但对于 3 个不同的文本框,我需要 3 个不同的按钮。

你能帮我用一个按钮吗??? 请帮忙..

这是我为 1 个文本框完成的:

函数 insertAtCaret(areaId, embedctrl) {

        var text = document.getElementById(embedctrl).value;
        if (text != "-1") {
            var txtarea = document.getElementById(areaId);
            var scrollPos = txtarea.scrollTop;
            var strPos = 0;
            var br = ((txtarea.selectionStart || txtarea.selectionStart == '0') ?
                "ff" : (document.selection ? "ie" : false));
            if (br == "ie") {
                txtarea.focus();
                var range = document.selection.createRange();
                range.moveStart('character', -txtarea.value.length);
                strPos = range.text.length;
            }
            else if (br == "ff") strPos = txtarea.selectionStart;

            var front = (txtarea.value).substring(0, strPos);
            var back = (txtarea.value).substring(strPos, txtarea.value.length);
            txtarea.value = front + text + back;
            strPos = strPos + text.length;
            if (br == "ie") {
                txtarea.focus();
                var range = document.selection.createRange();
                range.moveStart('character', -txtarea.value.length);
                range.moveStart('character', strPos);
                range.moveEnd('character', 0);
                range.select();
            }
            else if (br == "ff") {
                txtarea.selectionStart = strPos;
                txtarea.selectionEnd = strPos;
                txtarea.focus();
            }
            txtarea.scrollTop = scrollPos;
        }
    }

在上面的例子中,下拉菜单的(embedctrl) selectedvalue 被插入到文本框中的光标位置。

第 2 部分:

我尝试使用下拉列表在文本框中插入文本,但它不起作用。任何见解,为什么?

<script type="text/javascript">
       $(document).ready(function () {
           var selectedTextBox;
           $("input[type='text']").on("focusin", function () {
               debugger;
               selectedTextBox = this;
           });
           $("#ddlEmbedDBField").on("change", function () {
               debugger;
               var value = document.getElementById('<%=ddlEmbedDBField.ClientID%>').value;
               if (document.getElementById('<%=ddlEmbedDBField.ClientID%>').value != "0")
               {
                   $(selectedTextBox).val(value);
               }              

           });
       });
</script>

【问题讨论】:

  • 你能举一些例子吗,你到目前为止所做的那个......?

标签: javascript c# asp.net cursor


【解决方案1】:

您可以在焦点更改时跟踪选定的文本框:

<script type="text/javascript">
    $(document).ready(function(){
        var selectedTextBox;
        $("input[type='text']").on("focusin", function() { 
            selectedTextBox = this;
        });
        $('#ddl').on("change",function(){
            var selectedVal = this.value;
            $(selectedTextBox).val(selectedVal);
        });
    });
</script>

显然,如果您有不止三个文本框,您的选择器就必须更加具体。

【讨论】:

  • 感谢DoctorMick...但是我的要求发生了一些变化。该按钮已替换为下拉列表。您能否请查看我的问题的第 2 部分以了解详细信息。还是非常感谢!!!
  • 两件事之一可能会导致问题。 1 - 您的 id 不是 #ddlEmberDBField 或 2 - 它是 #ddlEmberDBField 这可能意味着这不起作用: var value = document.getElementById('').value;而不是在更改回调中使用 document.getElementById 您应该只使用 this 关键字。我已经编辑了我的答案以使用下拉菜单。
【解决方案2】:

不使用 jQuery:

var lastclick;

		function LastClicked(elem){
			lastclick=elem;
		}

		function putText(area){
			lastclick.value=area.value;
		}
<input type="text" onblur="LastClicked(this)"/>
<input type="text" onblur="LastClicked(this)"/>
<input type="text" onblur="LastClicked(this)"/>
<input type="button" value="click me" onclick="putText(document.getElementById('mytext'))"/>
<textarea id="mytext" cols="20" rows="2"></textarea>

您跟踪关注的最后一个元素。

【讨论】:

  • 感谢法比奥!!!稍作修改,它非常适合我的需要。干杯!!
  • 很高兴有帮助:) @JacksonLopes
【解决方案3】:

你可以这样做

HTML 代码

<input type='text' id='my-textbox1' />
<input type='text' id='my-textbox2' />
<input type='text' id='my-textbox3' /><br/>
<input type='button' id='btn' value='Click' />

JS 代码

 $(document).ready(function(){
        var textSelected;
        $("input[type='text']").on("focusout", function() { 
            textSelected = this;

        });
        $("#btn").on("click", function() { 
            $(textSelected).val("Hello");
        });
    });

这是工作示例 Click

【讨论】:

  • 那行不通(至少在 Chrome 中不行),文本框因为单击按钮而失去焦点。
【解决方案4】:

检查此代码将实现您的目的。希望对您有所帮助。

var inputFocusedId;
function loadValue(){
    $('#'+inputFocusedId).val('abc');
}

function focussed(obj){
    inputFocusedId = $(obj).attr('id');
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<input type="text" id="input1" onfocus="focussed(this);" />
<input type="text" id="input2" onfocus="focussed(this);" />
<input type="text" id="input3" onfocus="focussed(this);" />


<button  onclick="loadValue()" >Submit</button>

【讨论】:

    猜你喜欢
    • 2011-10-07
    • 2017-08-24
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-03-23
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多