堆棧內存溢出
  簡體   English   中英

HTML表單單選按鈕不起作用

[英]Html form radio button not working

 原文  2010-11-02 05:15:41  6   2    php/ html/ css/ forms/ radio-button

問題描述

我的index.php包含一堆php和javascript代碼，以及以CSS格式格式化的html。 我對CSS不太了解，但是我認為這不會影響此html表單的可用性。 這是索引代碼： 

<!DOCTYPE html "-//W3C//DTD XHTML 1.0 Strict//EN" 
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <title>Untitled</title>
    <meta name="description" content="Choose"/>
    <meta name="keywords" content="choose "/>
    <link rel="shortcut icon" href="http://i/favicon.ico"> 

    <!--[if lt IE 7]>
        <script type="text/javascript" src="FullPageBackgroundImage/js/mootools.js"></script>
        <script type="text/javascript" src="FullPageBackgroundImage/js/core.js"></script>
    <![endif]-->


<link rel="stylesheet" type="text/css" href="style.css" />

</head>

<body>

<div id="content">
<div id="poll">
<form>

<input id="ch1" type="radio" name="choice" value="0" />
<label for="ch1">
<?php echo $current['choice1']; ?>
</label>
<br />
<input id="ch2" type="radio" name="choice" value="1" />
<label for="ch2">
<?php echo $current['choice2']; ?>
</label>
</form>
</div>
hello

</div>

</body>
</html>

這是CSS： 

body {
    background-color:#000;
    background:#fff;
    background-repeat: repeat-x;
    background-attachment:fixed;
}

#top_header{
    width:100%;
    height:52px;
    background:#FFF;
    position:fixed;
    left:0px;
    top:0px;
    z-index:-1;

}

#logo{
    background-image:url('Images/web_buttons.jpg');
    position:fixed;
    top:3px;
    left:0px;
    width:366px;
    height:45px;

}

#display{
    background-image:url('Images/web_buttons.jpg');
    background-position: 0px -40px;
    position:fixed;
    top:0px;
    left:420px;
    width:57px;
    height:19px;

}

#display_divider{
    background-image:url('Images/web_buttons.jpg');
    background-position: -100px -45px;
    position:fixed;
    top:0px;
    left:477px;
    width:8px;
    height:50px;    
}

a.display_single{
    background-image:url('Images/web_buttons.jpg');
    background-position: 0px -80px;
    position:fixed;
    top:0px;
    left:485px;
    width:67px;
    height:26px;
}

a:hover.display_single{
    background-image:url('Images/web_buttons.jpg');
    background-position: 0px -104px;
    position:fixed;
    top:0px;
    left:485px;
    width:67px;
    height:26px;
}

a.display_multiple{
    background-image:url('Images/web_buttons.jpg');
    background-position: 0px -128px;
    position:fixed;
    top:26px;
    left:485px;
    width:86px;
    height:26px;
}
a:hover.display_multiple{
    background-image:url('Images/web_buttons.jpg');
    background-position: 0px -152px;
    position:fixed;
    top:26px;
    left:485px;
    width:86px;
    height:26px;
}

#view{
    background-image:url('Images/web_buttons.jpg');
    background-position: 0px -58px;
    position:fixed;
    top:0px;
    left:620px;
    width:37px;
    height:19px;    
}

#view_divider{
    background-image:url('Images/web_buttons.jpg');
    background-position: -100px -45px;
    position:fixed;
    top:0px;
    left:657px;
    width:8px;
    height:50px;    
}

a.view_WTFest{
    background-image:url('Images/web_buttons.jpg');
    background-position: 0px -178px;
    position:fixed;
    top:0px;
    left:665px;
    width:69px;
    height:26px;
}

a:hover.view_WTFest{
    background-image:url('Images/web_buttons.jpg');
    background-position: 0px -204px;
    position:fixed;
    top:0px;
    left:665px;
    width:69px;
    height:26px;
}

a.view_lamest{
    background-image:url('Images/web_buttons.jpg');
    background-position: 0px -228px;
    position:fixed;
    top:26px;
    left:665px;
    width:69px;
    height:25px;
}

a:hover.view_lamest{
    background-image:url('Images/web_buttons.jpg');
    background-position: 0px -253px;
    position:fixed;
    top:26px;
    left:665px;
    width:69px;
    height:25px;
}

a.view_latest{
    background-image:url('Images/web_buttons.jpg');
    background-position: 0px -275px;
    position:fixed;
    top:0px;
    left:734px;
    width:69px;
    height:25px;
}

a:hover.view_latest{
    background-image:url('Images/web_buttons.jpg');
    background-position: 0px -300px;
    position:fixed;
    top:0px;
    left:734px;
    width:69px;
    height:25px;

}

a.view_oldest{
    background-image:url('Images/web_buttons.jpg');
    background-position: 0px -323px;
    position:fixed;
    top:26px;
    left:734px;
    width:69px;
    height:26px;
}

a:hover.view_oldest{
    background-image:url('Images/web_buttons.jpg');
    background-position: 0px -348px;
    position:fixed;
    top:26px;
    left:734px;
    width:69px;
    height:25px;

}

a.submit_choices{
    background-image:url('Images/web_buttons.jpg');
    background-position: 0px -373px;
    position:fixed;
    top:3px;
    right:3px;
    width:164px;
    height:41px;
}

a:hover.submit_choices{
    background-image:url('Images/web_buttons.jpg');
    background-position: -162px -373px;
    position:fixed;
    top:3px;
    right:3px;
    width:164px;
    height:41px;

}

a.navigation_left{
    background-image:url('Images/web_buttons.jpg');
    background-position: 0px -413px;
    position:fixed;
    bottom:6px;
    left:3px;
    width:134px;
    height:19px;
}

a:hover.navigation_left{
    background-image:url('Images/web_buttons.jpg');
    background-position: -134px -413px;
    position:fixed;
    bottom:6px;
    left:3px;
    width:134px;
    height:19px;
}

a.navigation_right{
    background-image:url('Images/web_buttons.jpg');
    background-position: 0px -435px;
    position:fixed;
    bottom:6px;
    right:3px;
    width:104px;
    height:19px;
}

a:hover.navigation_right{
    background-image:url('Images/web_buttons.jpg');
    background-position: -134px -435px;
    position:fixed;
    bottom:6px;
    right:3px;
    width:104px;
    height:19px;
}

/*conten*/
#content{
    position:relative;
    top:55px;
    z-index:-3;
}

這樣，我只能選擇第二個單選按鈕，而不能選擇第一個。 奇怪的是，如果我刪除輸入之間的中斷，它會完美運行。 或者，我可以將休息時間留在那里，然后刪除表格后的“ helloworld”，它也可以工作。

任何人有任何想法或發現任何錯誤嗎？ 我想使按鈕彼此重疊，並且在下面也需要其他文本。

CSS代碼在這里

2 個解決方案

解決方案1
 1 已采納  2010-11-02 06:11:59

為什么會有z-index:-3 ？ 您是在告訴瀏覽器將內容放在其他層后面...

解決方案2
 0  2010-11-02 06:04:04

CSS在這里幾乎肯定是有錯的。 看起來好像有一個子節點正在被選擇（ <br /> ），而這並不是您想要的。 也可能發生在Javascript中。

暫無
暫無

聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

相關問題 Twitter Bootstrap HTML表單單選按鈕不適用於PHP POST 我的循環中的 PHP/HTML 單選按鈕表單不起作用。 為什么？ 將默認值與html表單單選按鈕一起使用 在單選按鈕的選定值上獲取html表格 html、js 和 php，以表單形式發送單選按鈕 單選按鈕的Codeigniter Ajax表單驗證不起作用 HTML表單提交按鈕不起作用 html.php表單將布爾單選按鈕值呈現為“on” 提交時使用HTML表單，根據所選的單選按鈕值重定向到頁面 html表單中的php標簽單選按鈕驗證？
相關標簽
 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM