如何使用 javascript 在 PHP 中发送单选按钮值？ [复制]答案

【问题标题】：How can I send radio button value in PHP using javascript? [duplicate]如何使用 javascript 在 PHP 中发送单选按钮值？ [复制]
【发布时间】：2014-09-01 07:16:06
【问题描述】：

我已经在这里工作了一周，阅读了所有的 stackoverflow 和谷歌，但我无法解决这个问题。每次我测试它时，无论我点击哪个单选按钮，我都会得到第一个单选按钮。

我在电子邮件中得到的是：

Name: test
Email: test@live.com
phone: 9545027557
type: Residential

HTML：

<form name="controls" id="controls"  novalidate>
    <div class="control-group">
        <div class="controls">
            <input type="text" class="form-control" 
                   placeholder="Full Name" id="name" required
                   data-validation-required-message="Please enter your name" />
              <p class="help-block"></p>
        </div>
    </div>  
    <div class="control-group">
        <div class="controls">
            <input type="email" class="form-control" placeholder="Email" 
                   id="email" required
                   data-validation-required-message="Please enter your email" />
        </div>
    </div>  

    <div class="control-group">
        <div class="controls">
            <div class="btn-group" data-toggle="buttons" id="optionu" style="padding-left:25px"> 
                <label class="btn btn-primary active">
                    <input type="radio" class="form-control" id="optionu" name="optionu"
                           value="Residential" checked > Residential 
                </label>
                <label class="btn btn-primary ">
                    <input type="radio" class="form-control" id="optionu" name="optionu"
                           value="Commercial" > Commercial
                </label>
                <label class="btn btn-primary ">
                    <input type="radio" class="form-control" id="optionu" name="optionu"
                           value="Handyman" > Handyman
                </label>
            </div>
        </div>
    </div>
    <p></p>

    <div id="success"> </div> <!-- For success/fail messages -->
    <button type="submit" class="btn btn-danger pull-right">Request</button><br />
</form>

contact_me.js：

var name = $("input#name").val();  
var email = $("input#email").val(); 
var phone = $("input#phone").val(); 
var optionu = $("input#optionu").val();
var firstName = name; // For Success/Failure Message
// Check for white space in name for Success/Fail message
if (firstName.indexOf(' ') >= 0) {
    firstName = name.split(' ').slice(0, -1).join(' ');
}        
$.ajax({
    url: "bin/contact_me.php",
    type: "POST",
    data: {name: name, email: email,  optionu: optionu,  phone: phone},
    cache: false,
    success: function() {  
        // Success message
        $('#success').html("<div class='alert alert-success'>");
        $('#success > .alert-success').html("<button type='button' class='close' data-dismiss='alert' aria-hidden='true'>&times;")
            .append( "</button>");
        $('#success > .alert-success')
            .append("<strong>Your message has been sent. </strong>");
        $('#success > .alert-success')
            .append('</div>');

contact_me.php：

$name = $_POST['name'];
$optionu_value = $_POST['optionu'];
$phone = $_POST['phone'];
$email_address = $_POST['email'];

// create email body and send it
$to = 'test@gmail.com'; // put your email
$email_subject = "Contact form submitted by:  $name";
$email_body = "You have received a new message. \n\n".
              " Here are the details:\n \nName: $name \n  ".
              "Email: $email_address\n phone: $phone\n  type: $optionu";

【问题讨论】：

代码太多，真的都和问题有关吗？
我想我明白了...输入收音机的名称必须相同，但是，只需删除那些收音机上的 id...您可以检索所选值..我会发布测试答案...
抱歉，试图提供所有信息

标签： javascript php jquery html

【解决方案1】：

首先，您使用相同的 id 4 次。 ID have to be unique in document，您不能将相同的 id 设置为 4 个元素。另外我认为你从单选按钮获得价值的方式是错误的。

这或多或少是您从单选按钮获得价值的方式：（example from another SO question）

  var optionu = $('input[name=optionu]:checked', '#controls').val()

同时从所有 input[radio] 元素中移除 id。

<label class="btn btn-primary active">
   <input type="radio" class="form-control" name="optionu" value="Residential" checked /> Residential 
 </label>
 <label class="btn btn-primary ">
   <input type="radio" class="form-control" name="optionu" value="Commercial" /> Commercial
 </label>
 <label class="btn btn-primary ">
   <input type="radio" class="form-control" name="optionu" value="Handyman" /> Handyman
 </label>

【讨论】：

谢谢我知道 id 但这是唯一有效的方法但是再次感谢我不能告诉你这对我有多大帮助

【解决方案2】：

试试这个：

$('input[name=optionu]:checked').val()

在这里工作：http://jsfiddle.net/robertrozas/9dYrR/

【讨论】：

【解决方案3】：

你必须找到收音机的检查值。你只是得到了第一个单选元素的值。

How can I know which radio button is selected via jQuery?

编辑：您也不能为每个单选按钮使用相同的 ID。您必须给它一个类名或使用 jQuery 按名称引用按钮。

【讨论】：