0

我的表单中有以下 HTML 片段。jQuery 正在检查哪个收音机被选中，然后使用该text()方法更改我元素中的文本。我确信有一种更好、更简洁的方式来写这个。有人可以详细说明如何以及为什么？

<p>
    <span class="input_small"><html:radio property="jobPosting.employmentTypeCode" value="RFT" styleId="fulltime" ><label for="fulltime">Full-Time</label></html:radio></span>
    <span class="input_small"><html:radio property="jobPosting.employmentTypeCode" value="RPT" styleId="parttime" ><label for="parttime">Part-Time</label></html:radio></span>
</p>

<p>
    <label for="responsibilities"><span class="job-time">*</span> position available with growing technology and government contracting firm. This person is responsible for:</label>
    <html:textarea property="jobPosting.requirements" rows="5" styleClass="input_xxxlarge" styleId="responsibilities" > </html:textarea>
</p>

jQuery：

$(document).ready(function() {
    $('#fulltime').click(function() {
        if($('#fulltime').is(':checked')) {
            $('span.job-time').text('FT');
        }
    });
    $('#parttime').click(function(){
        if ($('#parttime').is(':checked')) {
            $('span.job-time').text('PT');
        }
    });
});

编辑：我想知道如何用尽可能少的 jQuery 代码来完成这项任务。

4

3 回答 3

2

你可以这样缩写它：

 $('#fulltime, #parttime').click(function() {
    if($(this).is(':checked')) {
        $('span.job-time').text( $(this).val().substring(1) );
    }
  });

在这里，我碰巧你的单选按钮值分别是RFT和RPT全职和兼职，所以我用最后两个字符来设置span.job-time.

于 2013-04-29T18:11:52.987 回答
1

您可以组合选择器，因此只有一键式功能（您甚至可以缩短 if @Palash Mondal 提到的）：

$('#fulltime, #parttime').click(function() {
    if($('#fulltime').is(':checked')) {
        $('span.job-time').text('FT');
    }
    if ($('#parttime').is(':checked')) {
        $('span.job-time').text('PT');
    }
});
于 2013-04-29T18:08:13.117 回答
1

尝试这个：

$('[id$=time]').change(function () {
    $('span.job-time').text($('#fulltime').is(':checked') ? 'FT' : 'PT');
});
  • 调用change事件代替click，所以
  • id$=timetime用于以文本结尾的 id
  • 如果fulltime选中单选按钮，则将跨度文本设置为FTelse as PT。
于 2013-04-29T18:08:20.923 回答