使用JavaScript從一個文本框到另一個文本框的文本

Question

我有一個文本框

 @Html.TextBoxFor(m => m.SingleUnitBarcode, new { @class = "form-control",@id="barcode1", onblur = "CloneData" })

關於失去此文本框的焦點，我希望其中的文本顯示在另一個文本框中（id = customerbarcode_field）

我正在使用javascript

<script>
    function CloneData() { 
        var value = document.getElementById("#barcode1").value

        document.getElementById("#customerbarcode_field").value = value;
    }
</script>

但是，當我從第一個文本框失去焦點時，不會觸發該功能。

我錯過了什么 ？

Answer 1

您必須將onblur=CloneData更改為以下內容：

onblur=CloneData()

同樣，您必須更改DOM元素的選擇。 我的意思是您應該在document.getElementById()方法中更改#標簽。 在那里，我們傳遞要選擇的DOM元素的Id ，而無需在Id之前添加# 。 例如，您應該使用此

document.getElementById("customerbarcode_field")

對此感興趣

document.getElementById("#customerbarcode_field")

如果您使用的是JQuery ，那么您將選擇此元素為：

$('#customerbarcode_field')

Answer 2

修改文本框，如下所示：

@Html.TextBoxFor(m => m.SingleUnitBarcode, 
                new { @class = "form-control",
                      @id="barcode1", 
                      onblur = "CloneData()" })

和這樣的腳本，在javascript中，您正在將javascript與jquery混合：

<script>
    function CloneData() { 
        var value = document.getElementById("barcode1").value

        document.getElementById("customerbarcode_field").value = value;
    }
</script>

如果要使用jQuery，則：

<script>
        function CloneData() { 
            var value = $("#barcode1").val();

            $("#customerbarcode_field").val(value);
        }
    </script>

Answer 3

用onblur = "CloneData" onblur = "CloneData()"替換onblur = "CloneData" onblur = "CloneData()"並從ID中刪除#

function CloneData() { 
    var value = document.getElementById("barcode1").value

    document.getElementById("customerbarcode_field").value = value;
}

Answer 4

更換

@Html.TextBoxFor(m => m.SingleUnitBarcode, new { @class = "form-control",@id="barcode1", onblur = "CloneData" })

有了這個：

@Html.TextBoxFor(m => m.SingleUnitBarcode, new { @class = "form-control",@id="barcode1", onblur = "CloneData();" })

Answer 5

以這種方式將您的javascript事件放在html中是不好的做法。 由於您已經在使用jquery，因此可以附加一個偵聽器而不會污染html；

$("body").on('blur', '#barcode1', function(){
     $("#customerbarcode_field").val($(this.val());
});