Question

我为我的朋友和我制作了一个网站。主要功能是民意调查，询问谁更好。我将输入类型设置为无线电。我想知道我是否可以使用我的自定义图像作为按钮而不仅仅是我点击的圆圈。一个按钮有我的名字，另一个按钮有我的朋友。

这是目前的代码：

<html>
    <head>
        <title>Home</title>
        <meta name="author" content="My Name">
        <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />

        <link rel="stylesheet" rev="stylesheet" href="divs.css"
            type="text/css" media="screen" charset="utf-8" />
        <link rel="stylesheet" rev="stylesheet" href="styles.css"
            type="text/css" media="screen" charset="utf-8" />

        <script>
            function getVote(int) {
                if (window.XMLHttpRequest) {
                // code for IE7+, Firefox, Chrome, Opera, Safari
                    xmlhttp=new XMLHttpRequest();
                    } else {  // code for IE6, IE5
                    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
                            }
                xmlhttp.onreadystatechange=function() {
                    if (xmlhttp.readyState==4 && xmlhttp.status==200) {
                document.getElementById("poll").innerHTML=xmlhttp.responseText;
                }
                                }
                    xmlhttp.open("GET","poll_vote.php?vote="+int,true);
                xmlhttp.send();
                }
        </script>
    </head>

    <body>

        <div id="all"> <!-- Start All Div -->

            <div id="header"> <!-- Start Header Div -->

                <embed width="800" height="100px" src="../Media/Banner/banner.swf">
                <embed width="800" height="50px" src="../Media/DD Menu/ddmenu3.swf">

            </div> <!-- End Header Div -->

            <div id="main"> <!-- Start Main Div -->

                <div id="poll">
                    <h3>Me or Friend?</h3>
                    <form>
                    Me:
                    <input type="radio" name="vote" value="0" onclick="getVote(this.value)">
                    <br>
                    Friend:
                    <input type="radio" name="vote" value="1" onclick="getVote(this.value)">
                    </form>
                </div>

            </div> <!-- End Main Div -->

            <div id="footer"> <!-- Start Footer Div -->

                <p class="footer">&copy; Copyright,
                    2014 - <script language="javascript" type="text/javascript">
                                        var today = new Date()
                                        var year = today.getFullYear()
                                        document.write(year)
                                    </script></p> 

            </div> <!-- End Footer Div -->

        </div> <!-- End All Div -->

    </body>
</html>


<?php
$vote = $_REQUEST['vote'];

//get content of textfile
$filename = "poll_result.txt";
$content = file($filename);

//put content in array
$array = explode("||", $content[0]);
$yes = $array[0];
$no = $array[1];

if ($vote == 0) {
  $yes = $yes + 1;
}
if ($vote == 1) {
  $no = $no + 1;
}

//insert votes to txt file
$insertvote = $yes."||".$no;
$fp = fopen($filename,"w");
fputs($fp,$insertvote);
fclose($fp);
?>

<h2>Result:</h2>
<table>
<tr>
<td>Yes:</td>
<td>
<img src="poll.gif"
width='<?php echo(100*round($yes/($no+$yes),2)); ?>'
height='20'>
<?php echo(100*round($yes/($no+$yes),2)); ?>%
</td>
</tr>
<tr>
<td>No:</td>
<td>
<img src="poll.gif"
width='<?php echo(100*round($no/($no+$yes),2)); ?>'
height='20'>
<?php echo(100*round($no/($no+$yes),2)); ?>%
</td>
</tr>
</table>

Answer 1

当然，但它将使用javascript。这是使用Jquery的示例。请注意，输入无线电位于屏幕之外，因此可以设置而无需用户看到。

HTML

<p>Choice 1</p>
<img id="choice-1" class="button" src="path/to/img.png"/>
<input id="choice-1-input" type="radio" name="vote" value="0" style="position: absolute; left: -9999px" onclick="getVote(this.value)">

JavaScript与Jquery。根据要求包括上下文。

$(document).ready(function() {

  $('#choice-1').click(function()
  {
    radiobtn = document.getElementById("#choice-1-input");
    radiobtn.checked = true;
  });

}

用于php poll的自定义按钮

1 个答案: