如何在使用jQuery的PHP单击文本框时选择单选按钮？

我有一个PHP表单，它为用户提供了两个单选按钮选项（“所有日期”和“日期范围”）

如果用户开始键入“开始日期”或“结束日期”，我希望自动选择“日期范围”单选按钮

另外，如果选择了“所有日期”单选按钮，我希望清除“开始日期”和“结束日期”文本字段

注意：下面的div是可以克隆的表单的一部分，因此id/name元素的“#index#”变量（因此不确定是否可以使用id/name引用）

提供日期：
所有日期

日期范围：
开始日期：
结束日期：

将您的HTML（CFML）更改为此（注意添加了索引=“#index#”）：

---

我假设jQuery代码被包装在cfoutput标记中（基于哈希标记的存在），这就是为什么我对id选择器进行了双重哈希处理，以获得dates\u allNo cfoutput。一切都是用PHP编写的。我正在使用一个名为SheepIt的jQuery插件！进行克隆，并在中添加哈希标记。当呈现页面时，哈希标记实际上并不显示，而是根据克隆号显示0、1、2。嗯，好吧，忽略双哈希。希望该插件不会因为选择器中存在单个散列而出错。

<div>
    <label>Dates to Give:</label>
    <div>
        <input type="radio" name="dates_#index#" id="dates_all_#index#" class="required" value="1" />
        All dates<br />
        <input type="radio" name="dates_#index#" id="dates_range_#index#" class="required" value="0" />
        Date Range:
        <div id="give_from">
            <div>
                <label> Start Date:</label>
                <input type="text" name="start_date_#index#" id="start_date_#index#" class="date start_date" />
            </div>
            <div>
                <label> End Date:</label>
                <input type="text" name="end_date_#index#" id="end_date_#index#" class="date end_date" />
            </div>
        </div>
    </div>
</div>

<div>
    <label>Dates to Give:</label>
    <div>
        <input type="radio" name="dates_#index#" index="#index#" id="dates_all_#index#" class="required" value="1" />
        All dates<br />
        <input type="radio" name="dates_#index#" id="dates_range_#index#" class="required" value="0" />
        Date Range:
        <div id="give_from">
            <div>
                <label> Start Date:</label>
                <input type="text" name="start_date_#index#" index="#index#" id="start_date_#index#" class="date start_date" />
            </div>
            <div>
                <label> End Date:</label>
                <input type="text" name="end_date_#index#" index="#index#" id="end_date_#index#" class="date end_date" />
            </div>
        </div>
    </div>
</div>

$(function () {


    $(".end_date, .start_date").keypress(function () {
        $("#dates_range_" + $(this).attr('index')).attr("checked", true);
    });

    $("##dates_all_#index#").click(function () {
        $("##end_date_" + $(this).attr('index') + ", ##end_date_" + $(this).attr('index')).val("");

    });
});