如何检查是否已选中单选按钮以显示继续按钮

时间:2020-01-13 13:04:18

标签: javascript jquery

我有两个单选按钮,用于在结帐时选择一种送货方式。我想用jquery检查是否选中了这些单选按钮之一,然后将显示要进行结帐的按钮,否则将被隐藏。

HTML / PHP

<form method="get">
   <label class="ship-method" style="float: left; margin-right: 20px;">
   <input type="radio" name="dm_shipping_option" id="tttm_courier" value="1" onclick="getCourier(1);" />
   <?php echo $shipping_costs; ?>&euro;&nbsp;<?php echo getValue('name','banners',3); ?>
   <?php echo "<br />"; ?>
   <span class="ship-desc"><?php echo getValue('content','banners',3); ?></span>
   </label>
   <label class="ship-method" style="float: left; margin-right: 20px;">
   <input type="radio" name="dm_shipping_option" id="client_courier" value="0" onclick="getCourier(0);" />
   <?php echo getValue('name','banners',2); ?>
   <?php echo "<br />"; ?>
   <span class="ship-desc"><?php echo getValue('content','banners',2); ?></span>
   </label>
</form>

jQuery

 <script type="text/javascript">
    $(document).ready(function () {
        var isCheckedTTCourier = $('#tttm_courier').prop('checked');
        var isCheckedCourier = $('#client_courier').prop('checked');
        if (!isCheckedTTCourier) {
            $("#submit-btn").css('display', 'none');
        } else {
            $("#submit-btn").css('display', 'block');
        }
    });
</script>

5 个答案:

答案 0 :(得分:3)

您可以尝试以下方法:

public override void DrawCell(ListView listView, int section, int row, XGraphics page, XRect bounds, double scaleFactor)
{
    XFont font = new XFont(yourCustomFont ?? GlobalFontSettings.FontResolver.DefaultFontName, label.FontSize * scaleFactor);
    var yourObject = (listView.ItemSource as List<YourObjType>).ElementAt(row);

    page.DrawString(yourObject.Text, font, XColors.Black, bounds,
    new XStringFormat {
        LineAlignment = XLineAlignment.Center,
        Alignment = XStringAlignment.Center,
    });
}

答案 1 :(得分:3)

试试看!我为您制作了一个示例片段,该片段可以按预期工作。您可以根据情况切换按钮。

function getCourier(id) {
  var isCheckedTTCourier = $('#tttm_courier').prop('checked');

  var isCheckedCourier = $('#client_courier').prop('checked');

  $("#submit-btn").toggle(isCheckedTTCourier || isCheckedCourier);
};
#submit-btn {
  display: none;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form method="get">
  <label class="ship-method" style="float: left; margin-right: 20px;"> Radio Button 1
   <input type="radio" name="dm_shipping_option" id="tttm_courier" value="1" onclick="getCourier(1);" />

   <label class="ship-method" style="float: left; margin-right: 20px;"> Radio Button 2
   <input type="radio" name="dm_shipping_option" id="client_courier" value="0" onclick="getCourier(0);" />
   
   <br />
   <br />
    <button id="submit-btn">Submit</button>
</form>

答案 2 :(得分:2)

只需对代码稍作更改,希望对您有所帮助。

if($('#tttm_courier').attr('checked', true)){
    $("#submit-btn").css('display','block');
}else {
    $("#submit-btn").css('display','none');
}

答案 3 :(得分:1)

您可以使用.toggle(condition)

$("#submit-btn").toggle(isCheckedTTCourier || isCheckedCourier);

答案 4 :(得分:1)

$(#id).is(':checked')

这将给出是否选中特定按钮

相关问题