Question

我正在努力为复选框添加功能。选中该复选框后，我想用yes自动填充文本框。但我无法获得功能。任何见解都非常感谢。以下是我尝试使用的代码

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">
        </script>
        <script language="JavaScript">
        $(document).ready(function() 
        {    
      $('#checkboxid').attr('checked', true) {
            $("input[Title='Text Box Name']").val("Yes");    }

        });
        </script>

以下是这两个项目的HTML代码。请使用我的HTML代码，它是Sharepoint的自动生成代码。

对于文本框和复选框

<TR><TD nowrap="true" valign="top" width="190px" class="ms-formlabel">
<H3 class="ms-standardheader">
            <nobr>Text Box name</nobr>
        </H3></TD><TD valign="top" class="ms-formbody" width="400px">
    <div align="left" class="ms-formfieldcontainer">
<div class="ms-formfieldlabelcontainer" nowrap="nowrap">
<span class="ms-formfieldlabel" nowrap="nowrap">Text Box name</span></div>
<div class="ms-formfieldvaluecontainer"><span dir="none">
<input name="ctl00$m$g_89e4bf6d_529c_49e0_95e0_7024e4172c50$ctl00$ctl04$ctl63$ctl00$ctl00$ctl04$ctl00$ctl00$TextField" type="text" maxlength="255"
id="ctl00_m_g_89e4bf6d_529c_49e0_95e0_7024e4172c50_ctl00_ctl04_ctl63_ctl00_ctl00_ctl04_ctl00_ctl00_TextField" 
title="Text Box name" class="ms-long" /><br></span></div></div></TD></TR>

<TR><TD nowrap="true" valign="top" width="190px" class="ms-formlabel">
<H3 class="ms-standardheader">
<nobr>Check Box name</nobr>
    </H3></TD>
        <TD valign="top" class="ms-formbody" width="400px">
        <div align="left" class="ms-formfieldcontainer">
        <div class="ms-formfieldlabelcontainer" nowrap="nowrap">
        <span class="ms-formfieldlabel" nowrap="nowrap">Check Box name</span></div>
        <div class="ms-formfieldvaluecontainer"><span dir="none">
        <input id="ctl00_m_g_89e4bf6d_529c_49e0_95e0_7024e4172c50_ctl00_ctl04_ctl60_ctl00_ctl00_ctl04_ctl00_ctl00_BooleanField" 
        type="checkbox" 
        name="ctl00$m$g_89e4bf6d_529c_49e0_95e0_7024e4172c50$ctl00$ctl04$ctl60$ctl00$ctl00$ctl04$ctl00$ctl00$BooleanField" /><br>
    </span></div></div></TD></TR>

Answer 1

$('#checkboxid').attr('checked', true) { $("input[Title='Text Box Name']").val("Yes"); }

这会将复选框设置为选中并添加值，但不会对事件执行任何操作。

$('#checkboxid').change(function(){
    $('input[Title='Text Box Name']").val("");
    if ($('#checkboxid').is(':checked')) { 
        $("input[Title='Text Box Name']").val("Yes"); 
    }
});

Answer 2

如果您只想在页面加载期间检查条件，请尝试：

$(document).ready(function(){
    if($('#checkboxid').is(':checked')) {
        $("input[Title='Text Box name']").val("Yes");    
    }          
});

如果您想在每次点击checkex时检查条件，请尝试：

$(document).ready(function(){
    $('#checkboxid').click(function(){
            $("input[Title='Text Box name']").val($(this).is(':checked')?"Yes":"");    
    });
});

Answer 3

$(function(){
    $('#checkboxId').click(function(e)){
        if($(this).is(':checked')){
            $("input[Title='Text Box Name']").val("Yes");
        }
    }

}

将checkboxId替换为您的复选框的ID。

Answer 4

var textboxid = "#ctl00$m$g_89e4bf6d_529c_49e0_95e0_7024e4172c50$ctl00$ctl04$ctl63$ctl00$ctl00$ctl04$ctl00$ctl00$TextField";
var checkboxid = "#ctl00_m_g_89e4bf6d_529c_49e0_95e0_7024e4172c50_ctl00_ctl04_ctl60_ctl00_ctl00_ctl04_ctl00_ctl00_BooleanField";

$(document).ready(function () {
  $(checkboxid).change(function () {
    if ($(this).prop("checked")) {
      $(textboxid).val("Yes")
    }
  });
  //to trigger the event on load in case the checkbox is checked when the page loads
  $(checkboxid).trigger("change");  
});

选中复选框ID时自动填充文本框 - Jquery

4 个答案: