单选按钮空间和检查

时间:2014-05-03 20:51:57

标签: javascript ruby-on-rails

我有以下代码并且有三个问题。第一个是我希望在观看时有4,8,16和24之间的空间。第二个问题是我希望单选按钮在选中时进行检查。最后一个是我希望它最初在8小时内被检查为默认值。感谢。

h4
    .span3 Site Name: #{@site.site_code}
    span.pull-right Capacity Reserve Left: #{capacity_left}
    .span6 
      | Reserve Hours Required: 
      .input-group
        span.input-group-addon
          form#hours_select method="get"
            input type="radio" name="hours" id="res4" value="4"
            | 4
            input type="radio" name="hours" id="res8" value="8"
            | 8
            input type="radio" name="hours" id="res16" value="16"
            | 16
            input type="radio" name="hours" id="res24" value="24"
            | 24
javascript:
  $('input[name="hours"]').change(function() {
    //window.location = window.location + "?hours=" + $('input[name="res"]').val()
    $('#hours_select').submit()
  })

2 个答案:

答案 0 :(得分:0)

我会将收音机标签放入标签标签中。这有助于解决前两个问题:

问题1:设置标签标签的样式以添加填充权限。

问题2:使用“for”属性。例如,在HTML中:

<input type="radio" name="hours" id="res24" value="24" /><label for="res24">24</label>

单击“24”标签,您现在可以选中/取消选中单选框。

问题3:只需在输入中添加“已检查”属性(请参阅http://www.w3schools.com/tags/att_input_checked.asp)。示例:

 <input type="radio" name="hours" id="res8" value="8" checked />

答案 1 :(得分:0)

我很确定你的前两个问题是样式问题。在CSS中,使用paddinginput[type=radio]input[name="hours"]上的边距来展开您的收音机。

我真的不确定你的意思是“得到检查”,但如果你的意思是你希望它看起来像一个复选框而不是一个单选按钮,那么你可以找到一个造型的东西一点点谷歌搜索。一个stackoverflow答案在这里:Can you style an html radio button to look like a checkbox?

将8设为默认值,只需添加checked="checked",如下所示:

input type="radio" name="hours" id="res8" value="8" checked="checked"
        | 8