如何将值从一个函数传递给 HTML 回调？

Question

var sno=10;
row.insertCell(6).innerHTML="input type='button' value='edit' onclick='editRecord('sno');'";

I want to pass sno value to another function.

function editRecord(mySno){}

Answer 1

Try to not mix codes.

Creating an HTML Element

var newRow = row.insertCell(6),
      input = document.createElement('input');

This method is not just faster than the string innerHTML, it will allow you to handle the input as a JavaScript object.

input.type = 'button';
input.value = 'edit';
input.onclick = editRecord;

You have created a new row, but if you were not creating a new one, you can clear the code inside the row:

newRow = (function clearHtmlElement (el){
    var newEl = el.cloneNode();
    el.parentNode.replaceChild(newEl, el);
    return newEl;
}(newRow));

And finally append the input to the row element:

newRow.appendChild(input);

Saving your Value in the HTML Element scope

Then you are ready to save your value using attributes:

input.dataset.sno = 10;

or

input.setAttribute('data-sno', 10);

Or you can save it into the HTML Element:

input.sno = 10;

Using your value in your function

function editRecord () {
    var sno = this.sno
           || this.getAttribute('data-snow')
           || this.dataset.snow;
    ...
}

Choose your way to use it or use them all as I did here. Now you have sno available in your function and more important, it can be the JavaScript object you want .

---

UPDATE: to fit to the use of the function

If you want to use your function as defined on the problem, you'll have to do this trick, when you define the onclick handler:

input.onclick = (function(){
    var mySno = sno;
    return function(){
        editR(mySno);
    };
}());

here, using the scope, mySno will save the reference of the value of sno every time you define the onclick handler. BUT this will not work for objects , so only numbers or strings will work... plus it's a little bit ugly.

Answer 2

//when sno is an integer
var sno=10;
row.insertCell(6).innerHTML="input type='button' value='edit' onclick='editRecord(" + sno + ");'";

//when sno is a character
var sno='C';
row.insertCell(6).innerHTML="input type='button' value='edit' onclick='editRecord(\\'"+ sno +"\\');'";

Answer 3

editRecord('sno'); is passing the string 'sno', you need to pass the variable like so: editRecord(sno);

Answer 4

Use the below line I have written for you :

Code

var sno=10;
    row.insertCell(6).innerHTML="input type='button' value='edit' onclick='editRecord(\'"+sno+"\');'";

Answer 5

Never you cant use double quat in double quat or single in single. Its not true. "xxxxx"yyyyy"xxxx" you can use "xxxxx'yyyyy'xxxxx" Or "xxxxx\\"yyyyy\\"xxxx" Or "xxxx"+"yyyyy"+"xxxx"

var sno=10; row.insertCell(6).innerHTML="input type='button' value='edit' onclick='editRecord('+sno+');'";

Answer 6

You are passing it already with this line: onclick='editRecord(sno);'

Just remove the ' from sno.