Question

我在页面上有两个链接。当我点击第二个链接时，它会显示某些字段。我想为其中一个字段编写onkeyup()事件处理程序。我写了这样的代码，我错过了一些东西。请帮忙。

        var inputBox;
        $().ready(function() {

             //cc_sec is the id of the second link in my page.
             $('#cc_sec').click(function(){
               inputBox = document.getElementById("{!$Component.pg.pb.cardForm.cardnumber}");
               alert(inputBox.id);
               //This alert is giving me the ID of the element correctly.
            });   

            //This is not working. inputBox is declared as global variable.
            inputBox.onkeyup = function(){
                alert(inputBox.value);
                document.getElementById('printCardNo').innerHTML = inputBox.value;
            }

        });

请指出我的错误。 TIA :)

更新：我只能在点击cc_sec链接后按ID获取元素。因此，我无法在inputBox = document.getElementById("{!$Component.pg.pb.cardForm.cardnumber}");函数的开头ready进行操作。

Answer 1

使用jQuery .on将eventhandler添加到动态创建的元素中。

$('body').on("keyup","{!$Component.pg.pb.cardForm.cardnumber}",function(){
    alert($(this).val());
    document.getElementById('printCardNo').innerHTML = $(this).val();
});

Answer 2

您有两个选择

在文档准备中调用document.getElementById：

ssh ${USERNAME}@${GUEST_IP} "$(typeset -f install_packages); install_packages;"

或在点击事件中设置onkeyup：

var inputBox;
$().ready(function() {
     inputBox = document.getElementById("{!$Component.pg.pb.cardForm.cardnumber}");
     //cc_sec is the id of the second link in my page.
     $('#cc_sec').click(function() {
       alert(inputBox.id);
       //This alert is giving me the ID of the element correctly.
    });   

    inputBox.onkeyup = function() {
        alert(inputBox.value);
        document.getElementById('printCardNo').innerHTML = inputBox.value;
    };

});

如何将事件处理程序添加到按钮单击时呈现的元素？

2 个答案: