当我单击其中包含文本的文本字段并将焦点设置到字符串的末尾(大多数人通常会这样做)时,光标的焦点会跳转到字符串的开头。
这只发生在 IE 中。该应用程序是带有 jquery 和 javascript 的 MVC 2。
如何调试这种行为?我不能使用 firebug,因为这是 IE 唯一的行为。IE 开发人员工具“脚本”选项卡几乎没有显示有助于我调试的信息。
我已经梳理了我们的 jquery,但没有任何原因作为原因跳出来。
您将采取哪些步骤来调试此问题。CSS会导致这种行为吗?我不这么认为。
可能,它可能是 LABEL/INPUT 元素布局......这肯定是一个因素。
这是表单 HTML。javascript 非常有限,不会导致此问题,因此为了简洁起见,我将仅显示此表单片段:
<div>
<span class="field">
<div><label for="Input_Sku" style="width: 130px;">SKU:</label><span class="field"><input id="Input_Sku" name="Input.Sku" type="text" value="" /><span></span></span><p class="message"></p></div>
</span>
</div>
<div>
<span class="field">
<div><label for="Input_ProductName" style="width: 130px;">Product Name:</label><span class="field"><input id="Input_ProductName" name="Input.ProductName" type="text" value="professional" /><span></span></span><p class="message"></p></div>
</span>
</div>
编辑:
这是相当有限的Javascript代码:
<script>
$(document).ready(function() {
$('#reset').bind('click', function() {$('form').clearForm();});
$(".tbl").tablesorter({ debug: false });
$(".boxname").bind('click', function () {
$('.tog').toggle();$('.a').toggle();$('.b').toggle();
});
$.fn.clearForm = function() {location.reload();};
</script>
脚本参考:
<script src="/Scripts/jquery-1.4.2.min.js" type="text/javascript"></script>
<script src="/Scripts/jquery-ui-1.8.6.custom.min.js" type="text/javascript"></script>
我应该首先做的一个可能的解决方案是通过 JS Lint 运行页面,然后一次删除一个脚本引用,以查看行为是否消失 - 但我在这里采用“建设性惰性”方法。
编辑#2
我使用以下代码块尝试了 [this post][1] 中的解决方案:
var el = $("#Input_Sku");
el[0].onfocus = el[0].onblur = null;
$(el).on("focus blur", function(e) {
this.value = $.trim(this.value);
if ((e.type === "focus") && this.createTextRange) {
var r = this.createTextRange();
r.moveStart("character", this.value.length);
r.select();
}
});
但它只工作了一半。它会将光标定位到 INITIAL FOCUS 上的字符串末尾,但在那之后,页面中任何文本字段中的任何类型的单击或光标移动都会导致光标跳回前面!令人沮丧。
我需要开始消除我猜可能导致这种情况的脚本;这将是一个巨大的痛苦,但这个错误已经成为一个阻碍 - 所以我越来越绝望。