如何提交输入字段的ID

时间:2013-05-27 19:25:25

标签: javascript jquery html

单击时,是否可以(如果是,如何)提交输入字段的ID? 我在在线工具中创建了一个自动保存功能,每次输入字段模糊时都会保存。

但是,由于页面本身在每个场模糊上都会更新,因此在单击另一个字段时它会失去焦点,因此我希望它提交字段的ID,只需单击以便我可以将其设置为焦点,手动

(偏离主题)我在更新时不再使用jQuery,因为我需要页面来处理大量的数字,服务器...所以在我看来,最方便的是它按照描述工作。

我做了一些研究,结果有两种可能性:

focusobject = $(':focus');

document.activeElement

但是当做一个JS警报时,它只是说[object Object]和[object HTMLBodyElement]而不是“fieldEmail”

有什么想法吗?

更新

我以前用它在后台更新:

function writeNow(datastring) {
    $.ajax( {
        type: 'POST',
        url: 'update.php',
        data: datastring, 
        success: function(data) {
            // Do nothing       
            }
    });
}

这会在onBlur上更新字段,但页面本身会根据运行时的几个类方法计算很多结果。如果我使用AJAX来更新数据库值,我看不出如何设置类变量并显示正确的结果而不重新加载。

3 个答案:

答案 0 :(得分:1)

当你点击一个元素时,它更有可能获得焦点(除非有一些巫术阻止点击请求焦点)。您可以简单地处理输入组的onclick事件并保存它。

假设一些输入字段都具有类名txt-group-1

普通JS

var lastFocus = null;
if (document.activeElement.className == 'txt-group-1') {
    lastFocus = document.activeElement.id; // get the field that already has focus
}

var inputs = document.getElementsByClassName('txt-group-1');
for (var i=0;i<inputs.length;i++) {
    inputs[i].addEventListener('click', function(evt){
        alert(this.id+' has focus!');
        lastFocus = this.id;
    },true);
}

<强>的jQuery

var lastFocus = null;
if (document.activeElement.className == 'txt-group-1') {
    lastFocus = document.activeElement.id; // get the field that already has focus
}

$('.txt-group-1').click(function(evt){
    alert(this.id+' has focus!');
    lastFocus = this.id;
});

然后,lastFocus将始终具有焦点的最后一个元素的ID,以便您可以在需要时将其放回。


<强>更新

如果CMS需要保存字段:

在这种情况下,你最好的朋友将是ajax。我们的想法是能够在不刷新整个页面的情况下将新值保存在数据库中,从而停止任何后续操作。

我建议您查看保存字段的方法,并以不需要刷新页面的方式对其进行优化:

$.ajax({
  url: "save.php",
  data: {inputFieldName:'txtEmail', inputFieldValue:'foobar@mail.com'}
})
.done(function(data) {
  console.log('saved'); // after the request is complete
});

可以在.done事件中指定任何保存后的客户端操作。也可以从执行请求的服务器端脚本获得响应。

答案 1 :(得分:0)

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>

<body>
<input name="testfield" type="text" id="mtTextField" onClick="alertId(this.id);">
<script type="text/javascript">
    function alertId(getid)
    {
        alert(getid);   
    }
</script>
</body>
</html>

试试这段代码。

答案 2 :(得分:0)

使用Harsha的代码片段除了将其挂在“onchange”上,否则您将创建选项卡导航问题。您必须稍微修改保存功能,以便不会触发每个字符。 而且我建议使用AJAX而不是更新整个页面。