jquery numpad图像

Question

我正在尝试将图片添加到我当前的iframe小键盘中。我是jquery的新手，所以我不确定在哪里可以添加我对jquery的按钮图像。任何帮助将不胜感激。我的代码如下所示：

    // Get a numpad button    
    var GetButton = function(value, fn)
    {
        var button = document.createElement("input");
        button.type = "button";
        button.value = value;
        button.style.width = "80px";
        button.style.height = "70px";  

        button.onclick = fn;

        return button;
    };

    // Attach the Numpad control to the page.
    // Create the HTML elements and bind events    
    var Initialize = function ()
    {
        div = document.createElement("div");
        div.style.position = "absolute";
        div.style.zIndex = 999999;

        if(randomize === true)
        {
            var rem = [0,1,2,3,4,5,6,7,8,9];  
            var idx;
            var pos = 0;

            while(pos < 12)
            {
                if(pos != 9 && pos != 11)
                {            
                    idx = Math.floor(Math.random() * (rem.length));                    
                    button = GetButton(rem[idx], (function (value)
                        {
                            return function () { target.value += value; } 
                        })(rem[idx]));                    

                    div.appendChild(button);                    
                    rem = rem.Remove(idx);
                }
                else
                {
                    if(pos == 9)
                    {
                        button = GetButton("C", function () { target.value = ""; });
                        div.appendChild(button);
                    }


                }

                pos++;
            }
        }
        else
        {
            for(var i=1; i<=9; i++)
            {
                button = GetButton(i, (function (value)
                {
                    return function ()
                    {
                        target.value += value;
                    }          
                })(i));

                div.appendChild(button);
            }

            // Clear button     
            button = GetButton("", function ()
            {
                target.value = "";        
            });

            div.appendChild(button);

            // 0 button   
            button = GetButton(0, (function (value)
            {
                return function () { target.value += value; };        
            })(0));

            div.appendChild(button);

            // Close button
            button = GetButton("", function ()
            {
                target.value = "";
            });

            div.appendChild(button);
        }            

        div.style.width = "250px"; 
        iframe.style.position = "absolute";
        iframe.frameBorder = 0;

        document.body.appendChild(iframe);
        document.body.appendChild(div);

        Hide();
    };

Answer 1

CSS Background Image

input.button1 {
  background-image: url("images/foo.gif");
}

或使用按钮标记

<button><img src="images/foo.gif" alt="foo"/></button>