Question

我正在尝试使列表中的某些组件具有交互性，因为根据用户在表单上的输入，有很多注释和设置。

该产品由多个组件组成，每个组件都有自己的属性，但产品验证依赖于所选的一些组件值。

我有以下js函数从我的视图中调用：

function change_people() {
  money1 = $('money_1').children[0].value;
  if (money1 == 5) {
      $('comment_2').innerText = "sss";
      //$('comment_2').hide();
  } 
  else {
      $('comment_2').innerText = "";
      //$('comment_2').show();
  }
}

document.observe('dom:loaded', function() {
  change_people();
  $('money_1').children[0].observe('change', change_people);
});

当我在chrome中运行代码时，它运行正常，每次选择它都会更新下一个注释，但是，在firefox中完全没有响应！

有人知道原因吗？

（哦，正在使用原型库）

谢谢！

Answer 1

innerText是标准textContent的Microsoft版本。 Chrome支持两者，但Firefox只支持标准版。你可以做两件事：

1。虚拟测试（仅执行一次） keep in mind the gotchas

var textContent = (function() { 
  var dummy = document.createElement("span");
  dummy.innerHTML = "full <span>support</span>";
  if (dummy.textContent === "full support") {
     return "textContent";
  } else {
     return "innerText";
  }
})();

使用

el[textContent] = "text";

2. 使用DOM方法

function setText(el, text) {
    while (el.firstChild) {
        el.removeChild(el.firstChild);
    }
    el.appendChild(document.createTextNode(text));
}

使用

setText(el, "text");

Answer 2

使用Element.update更简单。

$('comment_2').update((money1 == 5) ? 'sss' : '');

Js功能在Chrome上正常运行，但在Firefox上运行不正常

2 个答案: