1

「div」の値を、作業中の表示関数に渡す方法を理解するのに助けが必要です。これが私のコードです。

//上にコンストラクター関数があり、「newbox」を宣言し、ボックスの値も取得します//ページにボックスを表示し、それらの値を取得すると正常に動作します

  function addBox(newbox) {  
   for (var i = 0; i < newbox.number; i++) {                                 
   var scene = document.getElementById("scene");              
   var div = document.createElement("div");                   
   div.className += " " + "box"; 
   div.innerHTML += newbox.name; 
   div.style.backgroundColor = newbox.color;  
   var x = Math.floor(Math.random() * (scene.offsetWidth-101));
   var y = Math.floor(Math.random() * (scene.offsetHeight-101));
   div.style.left = x + "px";
   div.style.top = y + "px"; 
   scene.appendChild(div); 
   div.onclick = display;                          
   //console.log("added"); 
    } 
   return div;                 
  }

//次の関数に渡す文字列を作る関数

  function makeString(name,color) {
  var aString = "name" + "color";
  return aString;
  }

// ボックスがクリックされたときにアラートを表示する関数を表示します。 

  function display(e) {
  var a = e.target;
  var string = makeString(a.name, a.color);
  a.onclick = alert(string);
  }

これまでのところ、ボックスをクリックすると、文字列「namecolor」が表示されます。「a.name」と「a.color」を実行することで、クリックしたターゲットからこれらの値を取得できると思いましたが、明らかに機能しませんでした。また、divをdisplay()関数に直接渡そうとしましたが、それを正しく行う方法がわかりませんでした。私は初心者なので、これは非常に明白かもしれませんが、助けていただければ幸いです。

4

4 に答える 4

3

addBox

forループでループして特定の数のdivを作成しているため、このメソッドは意味がありませんが、1つだけを返しますか?

function addBox(newbox) {
  var i, div, scene = document.getElementById("scene");
  for (i = 0; i < newbox.number; i++) {
    div = document.createElement("div");
    scene.appendChild(div);
    div.onclick = display;
  }
  return div;
}

次のようにするとより理にかなっています。

function addBox() {
  var i, div, scene = document.getElementById("scene");
  div = document.createElement("div");
  scene.appendChild(div);
  div.onclick = display;
  return div;
}


makeString

他の人が述べているように、変数ではなく文字列として扱われることを意味するため、変数を引用符で囲まないでください。

function makeString(name,color) {
  var aString = "" + name + color;
  return aString;
}


画面

stringアラートを受け取ることができるように availableの値を保持したい場合は、匿名関数をイベント ハンドラーに割り当てる必要がありますonclick。アラート メソッドの結果を割り当てるだけで、クリックを待たずにアラートがすぐに発生します。

a.onclick = alert(string);

ただし、このメソッドは、div をクリックするとトリガーされるdisplayため、まだ少し混乱しています。次に、div が次にクリックされたときにのみ起動するdisplay別のハンドラーを割り当てます。onclick

function display(e) {
  var a = e.target;
  var string = makeString(a.name, a.color);
  a.onclick = function(){
    alert(string);
  }
}

より理にかなっているのは次のとおりです。

function display(e) {
  var a = e.target;
  var string = makeString(a.name, a.color);
  alert(string);
}


名前と色

nameまた、あなたのコードはどこに言及しておらずcolor、div要素に設定されていますか? テキストの色、背景の色、またはその他の任意の値を意味しますか? また、要素の属性のようなものnameを意味しますか?.nodeName.name

div に任意の属性が必要な場合は、 を使用できるためsetAttribute、作成後に必要な値を割り当てます。

div = document.createElement("div");
div.setAttribute('name', 'this_is_my_name');
div.setAttribute('color', 'midnight blue');

そして、次を使用してそれらを取得しますgetAttribute。

var string = makeString(a.getAttribute('name'), a.getAttribute('color'));

または、他の人が述べているように、div の現在のテキストの色を取得することを期待している場合は、クロス ブラウザーの方法で読み返すのが簡単なdiv で具体的.currentStyle.colorに.getComputedStyle色を定義する方がはるかに簡単です。.style.color

div = document.createElement("div");
div.style.color = 'red';

そして、読み返すには：

alert( div.style.color );
于 2013-01-16T23:32:56.370 に答える
1

コードにいくつかの問題があります。

まず、これを変更します。

var string = makeString(a.name, a.color);

これに：

var string = makeString(a.innerHTML, a.currentStyle['color']);

次に、これを変更します。

var aString = "name" + "color";

これに：

var aString = name + color;

これにより、DIV の内容と DIV の現在のカラー CSS 属性が得られます。あなたの質問からは、何を表示したいのか正確にはわかりません。DIV から表示したいものを明確にするか、HTML で質問を更新することができれば、それに応じて回答を調整できます。

于 2013-01-16T23:21:20.720 に答える
1

引用符なしに変更var aString = "name+"color"しvar aString = name+colorます。

于 2013-01-16T23:22:25.450 に答える
1

試す

function makeString(name,color) {
    var aString = name+""+color;
    return aString;
}
于 2013-01-16T23:23:20.290 に答える