0

このスクリプトを使用して、ページの入力要素のデフォルト値を非表示にしています:

<script>

var active_color = '#000'; // Colour of user provided text
var inactive_color = '#ccc'; // Colour of default text


window.onload = formDefaultValues;

function formDefaultValues() {
  var fields = getElementsByClassName(document, "input", "default-value");
  if (!fields) {
    return;
  }
  var default_values = new Array();
  for (var i = 0; i < fields.length; i++) {
    fields[i].style.color = inactive_color;
    if (!default_values[fields[i].id]) {
      default_values[fields[i].id] = fields[i].value;
    }
    fields[i].onfocus = function() { 
      if (this.value == default_values[this.id]) {
        this.value = '';
        this.style.color = active_color;
      }
      this.onblur = function() {
        if (this.value == '') {
          this.style.color = inactive_color;
          this.value = default_values[this.id];
        }
      }
    }
  }
}



function getElementsByClassName(oElm, strTagName, strClassName){
  var arrElements = (strTagName == "*" && oElm.all)? oElm.all : oElm.getElementsByTagName(strTagName);
  var arrReturnElements = new Array();
  strClassName = strClassName.replace(/\-/g, "\\-");
  var oRegExp = new RegExp("(^|\\s)" + strClassName + "(\\s|$)");
  var oElement;
  for (var i = 0; i < arrElements.length; i++) {
    oElement = arrElements[i];
    if (oRegExp.test(oElement.className)) {
      arrReturnElements.push(oElement);
    }
  }
  return (arrReturnElements);
}
</script>

このコードを使用して、クラス "default-value" を持つ入力要素をループし、それらに対してアクションを実行します。それは本当にいくつかの要素で機能していますが、他の要素では機能していませんか? 何がうまくいかないのですか？

前もって感謝します

4

1 に答える 1

0

これは私のために働いた..

<html>
<script>
    function ViewAllElements() {
        var fe = document.forms['myForm'].elements;
        alert(fe.length);
        for(var i = 0; i < fe.length; i++)
        {
            alert(fe[i].value);
        }

        var ebc = getElementsByClassName(document, "input", "fieldA");
        alert(ebc.length);
        for(var j = 0; j < ebc.length; j++)
        {
            alert(ebc[j].value);
        }
    }

    function getElementsByClassName(oElm, strTagName, strClassName){
      var arrElements = (strTagName == "*" && oElm.all)? oElm.all : oElm.getElementsByTagName(strTagName);
      var arrReturnElements = new Array();
      strClassName = strClassName.replace(/\-/g, "\\-");
      var oRegExp = new RegExp("(^|\\s)" + strClassName + "(\\s|$)");
      var oElement;
      for (var i = 0; i < arrElements.length; i++) {
        oElement = arrElements[i];
        if (oRegExp.test(oElement.className)) {
          arrReturnElements.push(oElement);
        }
      }
      return (arrReturnElements);
    }

</script>

<body>
<form id="myForm" name="myForm">
    <input class="fieldA" id="field1" name="field1" value="field1value">
    <input class="fieldA" id="field2" name="field2" value="field2value">
    <input class="fieldA" id="field3" name="field3" value="field3value">
    <input class="fieldB" id="field4" name="field4" value="field4value">
    <input class="fieldB" id="field5" name="field5" value="field5value">
    <input class="fieldB" id="field6" name="field6" value="field6value">
    <input type="button" onClick="ViewAllElements();" value="View">
</form>
</body>
</html>
于 2013-03-28T20:29:27.003 に答える