Question

问题的一般要点是随机命令似乎在IE9中不起作用，或者仅偶尔起作用。适用于其他页面的命令就好了。

我已经排除了一些我不需要的东西，所以现在页面上只有两个javascripts。一个是jQuery 2.0.3，另一个是页面主要动作脚本：

$(function()
    {
    $("#lib").addClass("this_page");

    $(".output").each(convert_values);

    $("form .input_class").keyup(convert_values);
    $("form .input_class").change(convert_values);
    $(".swap").click(function($e)
        {
        var $form = $(this).closest("form");        
        var $input_value = $form.find(".input_units").val();
        var $output_value = $form.find(".output_units").val();
        $form.find(".input_units").val($output_value);
        $form.find(".output_units").val($input_value).change();
        $e.preventDefault();
        });
    });


function convert_values()
    {
    var $form = $(this).parent();
    var $input = $form.find(".input").val();
    $form.find(".input").removeClass("input_error");
    var $input_units = $form.find(".input_units").val();
    var $output_units = $form.find(".output_units").val();
    var $result = 0;

    if ($input == "") { $input = "0"; }

    console.log("data-type='"+$form.attr("data-type")+"'");
    if ( $form.attr("data-type") == "temp" )
        {
        switch ( String($input_units) + String($output_units) )
            {
            case "fc":
                $result = (Number($input) - 32) * (5/9); break;
            case "fk":
                $result = ((Number($input) - 32) * (5/9)) + 273.15; break;
            case "cf":
                $result = (Number($input) * 1.8) + 32; break;
            case "ck":
                $result = Number($input) + 273.15; break;
            case "kc":
                $result = Number($input) - 273.15; break;
            case "kf":
                $result = ((Number($input) - 273.15) * 1.8) + 32; break;
            default:
                $result = $input;
            }
        }
    else
        {
        console.log("("+$input+" / "+$output_units+") * "+$input_units);
        $result = (Number($input) / Number($output_units)) * Number($input_units);
        }

    if (isNaN($result))
        {
        //play_a_sound("snd_fail");
        $form.find(".input").addClass("input_error");
        $result = "Input Error";        
        }

    $form.find(".output").val($result);
    }

这个结果非常奇怪。我的convert_values（）函数在页面加载时被多次调用，它似乎工作正常。但是当你在页面加载后点击选择来调用它时，它就不起作用了。

更具体地说，

var $input = $form.find(".input").val();
var $input_units = $form.find(".input_units").val();
var $output_units = $form.find(".output_units").val();

这三行在脚本加载后会多次运行。但是稍后在脚本中，调用函数时$ output_units是未定义的。这一个函数和事件处理程序用于处理几个不同的单独HTML表单，这就是为什么没有特定的ID，只有类和基于$（this）的标识符。但是为什么其中2个命令会起作用，但不是第三个？为什么它有时会起作用，而不是剩下的时间。

此外，甚至在发生这种情况之前，还有这个检查：

if（$ form.attr（＆＃34; data-type＆＃34;）==＆＃34; temp＆＃34;）

大多数表单没有此属性。并且处理正常进行。但是在页面的中间，一个表单具有此属性。但IE9仍然会返回＆＃34; undefined＆＃34;由此。 IE9支持HTML5数据属性，因此没有明显的理由说明它不起作用。

根据我当前登录到控制台的内容，您可以看到前三个值何时正常工作，以及其中一个值何时切断且无法正常工作。当IE9错过data-type =＆＃34; temp＆＃34;同样的调试日志记录也会向您显示属性，因为你的数学中最终会出现字符串，因为程序流程没有针对这种特殊情况重定向。

所以随机，完全有效的命令似乎都失败了，无缘无故。但这种行为是100％可重复的。在这种现状中，我在IE9的JS控制台中没有遇到任何相关错误。它就像我的代码中的某些东西导致IE9变得混乱，但我不知道它是什么。

有问题的网页在这里： http://www.whatsmyip.org/lib/unit-converter/

该页面的javascript文件位于： http://www.whatsmyip.org/js/tools/lib/unit-converter.js

页面上的每个转换器都是它自己的FORM标签，＆＃34;温度＆＃34; form是具有data-type属性的表单，对于IE9来说似乎是不可读的。在它无法读取之后，它似乎也开始无法读取$ form.find（＆＃34; .output_units＆＃34;）。val（）;虽然它之前可以读得很好。

尽管我讨厌所有的IE，但我还没准备好放弃IE9。我的网站上几乎每个页面都有很多脚本，但这是我唯一的问题。所有其他页面都很棒。我在虚拟机中进行了大量的beta测试。

Answer 1

P标签不能包含块级项目。我原来的HTML包含很多这样的FORM：

<p>
<form>
      blahblah
      <div>Divider</div>
      dfasdfasdf
</form>

即使FORM是块标记，此代码也是有效的，因为P是自闭标记，因此FORM特别关闭了IE9中的P. 然而，此设置会导致FORM标记进入我将称之为“函数式的狗屎模式”，其中FORM中的任何块项将关闭FORM，然后是P。

在我的特定代码中，这个错误导致我的一半表单元素在FORM 外面呈现。当我开始搞乱所有事情的CSS时，这一点就很明显了。在我的表格周围画了一个边框，然后看一下，只有一半表格的元素在边框内！

所有这一切的结果是，我的Javascript找不到它需要的所有值，因为我通过搜索FORMs中的特定类来找到SELECT。现在奇怪的是，它可以正确处理大部分形式的onLoad，但之后就失败了。好像FORMs正确渲染了一秒钟，然后“捕捉”回到错误的版本，排除了一半的项目。

总而言之，我删除了每个FORM标签前面的P标签，现在IE9在功能上完全正常。我的表格现在可以包含DIV而没有任何问题。

随机IE9中的JavaScript失败/在IE9中过早关闭DIV的FORM标签

1 个答案: