JavaScript在IE9中失败/表单标记包含在IE9中过早关闭的DIV

问题的主要原因是随机命令在IE9中似乎不起作用，或者只是偶尔起作用。在其他页面上可以正常工作的命令

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

$(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（）函数在页面加载时被调用了好几次，它似乎工作得很好。但当你在页面加载后点击selects来调用它时，它就不起作用了

更具体地说

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）的标识符。但是为什么这些命令中有两个可以工作，而第三个却不行呢？为什么它有时会起作用，但在其他时间却不起作用

此外，在这种情况发生之前，还有一项检查：

if（$form.attr（“数据类型”）=“temp”）

大多数表单没有此属性。处理过程正常。但是在页面的中间，有一个表单确实具有此属性。但IE9仍然从中返回“未定义”。IE9确实支持HTML5的数据属性，因此没有明显的原因说明它不起作用

根据我当前登录到控制台的内容，您可以看到前三个值何时正常工作，以及其中一个值何时停止工作。同样的调试日志也会显示IE9是否忽略了data type=“temp”属性，因为在这种特殊情况下，由于程序流没有被重定向，您的数学结果是字符串

因此，随机的、完全有效的命令似乎无缘无故地失败了。但这种行为是100%可重复的。在目前的情况下，我在IE9的JS控制台中没有发现任何相关错误。这就像我的代码中有什么东西导致IE9失控，但我不知道是什么

有关网页如下：

该页面的javascript文件如下所示：

页面上的每个转换器都是它自己的表单标签，“温度”表单是一个具有数据类型属性的表单，对于IE9来说似乎不可读。在读取失败之后，它似乎也开始无法读取$form.find（“.output_units”）.val（）；虽然它以前能读得这么好

---

虽然我讨厌所有的IE，但我还不准备放弃IE9。我的网站上几乎每个页面都有很多脚本，但这是我唯一的问题。所有其他页面都很好用。我在虚拟机上做了很多beta测试

p标记不能包含块级项目。我的原始HTML包含许多如下表单：

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

布拉布拉赫
分隔器
dfasdfasdf

尽管表单是一个块标记，但此代码是有效的，因为p是自动关闭标记，因此表单关闭p。然而，在IE9中，此设置会导致表单标记进入我称之为“类似屎的功能模式”，其中表单中的任何块项都将关闭表单，然后关闭p

在我的特定代码中，这个bug导致我的表单元素的一半在表单之外呈现。这只有在我开始乱搞CSS的时候才清楚。在我的表单周围扔了一个边框，看看，只有一半的表单元素在边框内

所有这些的结果是，我的Javascript无法找到它所需要的所有值，因为我通过搜索表单中的特定类来找到select。现在更奇怪的是，它可以正确地处理大多数表单的onLoad，但是在那之后失败了。就好像表单在一秒钟内正确呈现一样，然后“捕捉”回有缺陷的版本，不包括一半的项

---

总之，我删除了每个表单标签前面的p标签，现在IE9的功能完全正常了。我的表单现在可以包含没有任何问题的div。

我建议您创建一个简化的html版本，您可以针对该版本运行此代码，但仍然会产生问题。一个非常简单的问题可以在问题中内联运行，而不需要访问一个在问题解决后可以正常工作的网页。它是否只是IE9，而不是IE11？在它的当前形式中，您的问题因以下原因而脱离主题：寻求调试帮助的问题（“此代码为什么不工作？”）必须包括所需的行为、特定的问题或错误以及在问题本身中重现这些问题所需的最短代码。没有明确问题陈述的问题对其他读者没有用处。请参阅：。我知道，如果我能将我的问题封装在一个易于使用的JSFIDLE帖子中，那将是非常棒的，但在这种情况下，这似乎是不可能的。这些症状是如此随机和不合逻辑，我必须先解决这个问题，然后才能找出是什么让IE表现如此糟糕，然后将其作为一个更具体的问题发布。此外，我不使用IE11进行测试，但IE10没有问题。我也不使用IE8及以下版本进行测试。好吧，我已经大致解决了这个问题。在IE9中，似乎将DIV或HR标记放在表单中，过早地结束了该表单标记。因此javascript找不到被碰撞的选择（.output_units），因此未定义。但我不完全理解为什么会发生这种情况？CSS让我明白了这个问题！我制作了一个精简的测试页面，由于DIV将表单一分为二而失败，当我使用一对BR标记时成功：