使用javascript获取活动字段ID

时间:2013-01-04 01:11:15

标签: javascript html

我有大约30个输入所有文本,我有一个按钮,我想在按下按钮时获得焦点的ID。 我怎么能得到它?

2 个答案:

答案 0 :(得分:4)

焦点很棘手。一旦其他元素(如点击按钮),我的焦点已经移动,因此您无法通过查看焦点来查看上次激活的输入字段。

您可以将焦点事件的事件处理程序附加到每个输入元素,并自己跟踪哪一个最后获得焦点,然后在按下按钮时使用该变量。

也许如果你描述了你想要解决的实际问题,我们可以提供更好的解决方案。

您可以在此处看到记住上一个有效输入字段的示例:http://jsfiddle.net/jfriend00/XmqPe/。单击按钮,最后一个活动字段将以红色突出显示。

var lastInput;
function gotInput() {
    lastInput = this;
}

function addEvent(elem, event, fn) {
    if (elem.addEventListener) {
        elem.addEventListener(event, fn);
    } else {
        elem.attachEvent("on" + event, function() {
            fn.call(elem, window.event);
        });
    }
}


var inputs = document.getElementsByTagName("input");
for (var i = 0; i < inputs.length; i++) {
    addEvent(inputs[i], 'focus', gotInput);
}

addEvent(document.getElementById('test'), 'click', function() {
    for (var i = 0; i < inputs.length; i++) {
        inputs[i].style.borderColor = '#000';
    }
    if (lastInput) {
        lastInput.style.borderColor = '#F00';
    }
});​

答案 1 :(得分:0)

您可以尝试此解决方法,以按下按钮获取焦点的最后一个输入:

使用jquery的示例:

<script type="text/javascript">
    $(document).ready(function () {

        var lastId = null;


        $(".inputTest").focus(function () {
            //put the last input id in a "global" variable:
            lastId = $(this).attr("id");
        });

        $("#btnTest").click(function () {

            if (lastId) {
                //if exists, do something:
                alert(lastId);
            }
        });
    });
</script>

Html示例:

<body>
     <input type="text" name="test1" id="test1" class="inputTest" />
     <input type="text" name="test2" id="test2" class="inputTest"/>
     <input type="text" name="test3" id="test3" class="inputTest" />
     <input type="text" name="test4" id="test4" class="inputTest" />
     <input type="text" name="test5" id="test5" class="inputTest" />
     <input type="text" name="test6" id="test6" class="inputTest" />

     <input type="button" value="test" id="btnTest" />

</body>