0

ラジオボタンが使用されている場合にIE8でコーナーの問題を回避するための正しい使用法は何ですか？例えば

<p:column id="rad" selectionMode="single" />データテーブルにあります

IE 8では、ラジオボタンは四角いボックス内のチェックボックスとして表示されます。だからこれを解決するために私は使用しました

<h:outputScript library="primefaces" name="jquery/jquery.js">
$(document).ready(function() {
          $('rad').corner();      
    });
</h:outputScript>

しかし、これは問題を解決しませんでした。

では、ラジオボタンの角を丸くする正しい方法は何ですか？

ありがとう

編集1

<h:head>

<style type="text/css">
   <![CDATA[


      .radio input 
{
    position: absolute;
    left: -9999px;
}

.label_radio 
{
    background: url("/radio_labels.jpg") no-repeat scroll 0 0 transparent;
    height: 1em;
    width: 1em;
}

.label_radio.r_on 
{
    background-position: 0 -18px;
}

.radio label 
{
    display: inline;
    padding-bottom: 0.1em;
    padding-right: 1.9em;
}


   ]]>
</style>
</h:head>


<h:outputScript>
    $(document).ready(function() {
    alert("1");
    $('.rad label').addClass('label_radio');
if ($('.rad input').length) {
    $('.rad input').each(function () {
        $(this).next('label').removeClass('r_on');
    });
    $('.rad input:checked').each(function () {
        $(this).next('label').addClass('r_on');
    });
};

    });
</h:outputScript>

およびデータテーブルのラジオボタン。

<p:column  id="rad" selectionMode="single"  />
4

1 に答える 1

2

これが私がやっている方法です：

CSS:

.radio input 
{
    position: absolute;
    left: -9999px;
}

.label_radio 
{
    background: url("images/buttons/radio_labels.jpg") no-repeat scroll 0 0 transparent;
    height: 1em;
    width: 1em;
}

.label_radio.r_on 
{
    background-position: 0 -18px;
}

.radio label 
{
    display: inline;
    padding-bottom: 0.1em;
    padding-right: 1.9em;
}

jQuery:

$('.address_type label').addClass('label_radio');
if ($('.address_type input').length) {
    $('.address_type input').each(function () {
        $(this).next('label').removeClass('r_on');
    });
    $('.address_type input:checked').each(function () {
        $(this).next('label').addClass('r_on');
    });
};

HTML:

<div class="address_type clear width">
<span class="radio twelvepx">
<input id="rbDelAddr" type="radio" value="0" name="AddrType">
<label class="label_radio" for="rbDelAddr">Delivery Address</label>
</span>
<span class="radio twelvepx">
<input id="rbInvAddr" type="radio" value="-1" name="AddrType">
<label class="label_radio" for="rbInvAddr">Billing Address</label>
</span>
</div>
于 2013-01-07T09:24:37.193 に答える