0

我正在修改一个 html 文件，我需要帮助它。它的头部有一堆创建一些按钮的javascript，所有按钮都被标记为id="#content"。

然后在正文中，它只是将所有按钮布置在一列中<div id="content" align:"center"></div>

我希望能够独立移动按钮，即将它们放在桌子上。我怎样才能做到这一点？

编码：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <meta name="viewport" content = "height = device-height, width = 420, user-scalable = no" />
        <title>Direct Current GUI</title>
        <script type="text/javascript" src="/webiopi.js"></script>
        <script type="text/javascript">
        webiopi().ready(function() {
                var content, button;
                content = $("#content");

                // create a "FORWARDS" labeled button for GPIO 7
                button = webiopi().createGPIOButton(7, "FORWARDS");
                content.append(button); // append button to content div

                // create a "REVERSE" labeled button for GPIO 8
                button = webiopi().createGPIOButton(8, "REVERSE");
                content.append(button); // append button to content div                                      
        });

        </script>

</head>
<body>
        <table>
                <tbody>
                        <tr><td id="content"></td></tr>

                </tbody>
        </table>
</body>
</html>
4

1 回答 1

0

您可以将按钮放置在您喜欢的任何位置，要更改的行如下所示：

    webiopi().ready(function() {
            var button;

            // create a "FORWARDS" labeled button for GPIO 7
            button = webiopi().createGPIOButton(7, "FORWARDS");
            $('#select-an-element-here').append(button); // append button to content div

            // create a "REVERSE" labeled button for GPIO 8
            button = webiopi().createGPIOButton(8, "REVERSE");
            $('#select-an-element-here').append(button); // append button to content div                                      
    });

这些$('#select-an-element-here')位可以针对您喜欢的页面上的任何元素。

例如：

<p id="example1"></p>
<div id="example2"></div>

您可以使用以下方法在每个按钮中放置一个按钮：

    webiopi().ready(function() {
            var button;

            // create a "FORWARDS" labeled button for GPIO 7
            button = webiopi().createGPIOButton(7, "FORWARDS");
            $('#example1').append(button);

            // create a "REVERSE" labeled button for GPIO 8
            button = webiopi().createGPIOButton(8, "REVERSE");
            $('#example2').append(button);                                      
    });
于 2013-01-30T20:54:56.457 回答