通过HTML将对象的名称传递给javascript

时间:2018-06-05 13:23:15

标签: javascript html

这是一个非常简单的问题,我在这里疯狂地搜索这一切并得到所有这些疯狂无关的答案。 这是代码:



function Banana(boja, duzina) {
  this.boja = boja;
  this.duzina = duzina;
}
var zut = new Banana("zuta", 12);

function fja(obj) {
  var rez = "";
  for (var key in obj)
    var rez += key + " = "
  obj.key + "<br/>";
  document.getElementById('div1').innerHTML = rez;
}
&#13;
<button onclick="fja();">klikni</button>
<div id='div1'>xd</div>
&#13;
&#13;
&#13;

是否可以传递对象的实例&#34; zut&#34;通过HTML来实现这个功能?如果是的话,如果不是,我该如何通过JS做到这一点? 我想将div1 html变成:

boja = zuta
duzina = 12 

感谢答案

2 个答案:

答案 0 :(得分:0)

function Banana(boja, duzina) {
  this.boja = boja;
  this.duzina = duzina;
}
var zut = new Banana("zuta", 12);

function fja(obj) {
  var rez = "";
  for (var key in obj)
    rez += key + " = "+ obj[key] + "<br/>";
  document.getElementById('div1').innerHTML = rez;
}
<button onclick="fja(zut);">klikni</button>
<div id='div1'>xd</div>

答案 1 :(得分:0)

你当然可以,但为什么你的代码不起作用是因为

1) - 您重新声明变量rez并使用无效的+=进行分配。

2) - obj.key无效,因为没有名为key的此类属性,要访问它,您需要使用括号obj[key]现在key将被视为变量和它的值将用于获取属性的值。

3) - 您错过了此行+

中的var rez += key + " = " (HERE) obj.key + "<br/>";

4) - 您对html中方法的调用缺少参数。

您可以使用onclick="fja(new Banana('zuta', 12));

或者在HTML中声明对象内联,或者在js中声明它并传递它名称

//in the Js
var zut = new Banana("zuta", 12);
//in the HTML
onclick="fja(zut);

示例一

&#13;
&#13;
function Banana(boja, duzina) {
  this.boja = boja;
  this.duzina = duzina;
}


function fja(obj) {
  var rez = "";
  for (var key in obj)
    rez += key + " = " + obj[key] + "<br/>";
  document.getElementById('div1').innerHTML = rez;
}
&#13;
<button onclick="fja(new Banana('zuta', 12));">klikni</button>
<div id='div1'>xd</div>
&#13;
&#13;
&#13;

示例二

&#13;
&#13;
function Banana(boja, duzina) {
  this.boja = boja;
  this.duzina = duzina;
}
var zut = new Banana("zuta", 12);

function fja(obj) {
  var rez = "";
  for (var key in obj)
    rez += key + " = " + obj[key] + "<br/>";
  document.getElementById('div1').innerHTML = rez;
}
&#13;
<button onclick="fja(zut);">klikni</button>
<div id='div1'>xd</div>
&#13;
&#13;
&#13;