无需javascript即可提交电台表格

时间:2013-05-28 17:49:33

标签: php javascript html

我有以下代码:

<div id="choices">
    <div>
       <input type="radio" name="question-answers" id="question-answers-A" value="A" onclick="this.form.submit();" />
       <label for="question-answers-A">$c[0] </label>
       </div>
       <div>
       <input type="radio" name="question-answers" id="question-answers-B" value="B" onclick="this.form.submit();"/>
  <label for="question-answers-B">$c[1]</label>
  </div>
  </div>

选择收音机时会提交表格。

有没有办法在没有javascript的情况下执行此操作? (没有onClick)

感谢。

5 个答案:

答案 0 :(得分:2)

为什么不传统的提交输入?

<form>
    <input type="radio" name="r1">
    <input type="radio" name="r2">
    <input type="submit" value="send" />
</form>
The form is submitted when a radio is selected.

Javascript是可以使用的方式或简单的旧HTML,但不会在更改时提交。

答案 1 :(得分:1)

无法使用Javascript检测单击单选按钮的时间。

答案 2 :(得分:1)

以下是在没有Javascript http://jsfiddle.net/DCHaT/8/

的情况下让它工作的示例

您依赖CSS和标签。

CSS:

button.transparent{
    position:absolute;
    left:0;
    right:0;
    top:0;
    bottom:0;
    visiblity:hidden;
    border:none;
    z-index:2;
    background-color:transparent;
}

div.radio{
    position:relative;
}

div.radio > label > input[type="radio"]{
    position:relative;
    z-index:1;
}

代码:

<form action="http://www.yahoo.com" method="GET">
    <div class="radio">
        <label for="radio_1">
    <button type="submit" class="transparent" name="radio" value="1"></button>
        <input type="radio" value="1" name="radio" id="radio_1"/>
        Radio 1</label>
    </div>
    <div class="radio">
        <label for="radio_2">
    <button type="submit" class="transparent" name="radio" value="2"></button>
     <input type="radio" value="2" name="radio" id="radio_2"/>
            Radio 2</label>
    </div>
</form>

答案 3 :(得分:0)

你可以使用php

    <div class="field form-inline radio">
  <label class="radio" for="txtContact">Preferred Method of Contact</label>
  <input class="radio" type="radio" name="contact" value="email" checked /> <span>Email</span>
  <input class="radio" type="radio" name="contact" value="phone" /> <span>Phone</span>
</div>


   $contact = $_POST['contact']
//Will return either "email" or "phone".

答案 4 :(得分:0)

使用两个提交按钮,并可选择将它们设置为单选按钮。 http://jsfiddle.net/trevordixon/FNzhb/3/

<form method="POST">
    <button type="submit" name="question-answers" value="A">A</button>
    <button type="submit" name="question-answers" value="B">B</button>
</form>

<style>
button {
    border: none;
    background: none;
    padding-left: 10px;
    cursor: pointer;
}

button:before {
    content: '';
    display: block;
    width: 12px;
    height: 12px;
    border: 1px solid #999;
    border-radius: 50%;
}

button:active:before { content: '•'; }
</style>