Javascript Yui 2.0通过多个单选按钮启用输入

我有一个使用Yui 2.0和一些自定义JS的应用程序。我最初并没有写它，所以我对Yui JS工具不是很熟悉。对于这个问题，我将看三个单选按钮和一个文本输入

现在的行为是，当您选择单选按钮s3时，您将启用文本输入以启用

我想看到的是，当您选择单选按钮S2或S3时，启用toEnable。然而，使用下面的示例，一旦您尝试在S2上使用NCRS_bind_to_radio方法，S3将失去同时影响toEnable输入的能力

有人知道我如何使用两个单选按钮启用/禁用此输入吗

<ul>
  <li><label><input value="MET" type="radio" name="selector" id="s1"> 1</label></li>
  <li><label><input value="MET" type="radio" name="selector" id="s2"> 2</label></li>
  <li><label><input value="MET" type="radio" name="selector" id="s3"> 3</label></li>
<ul>

<input id="change" type="text" name="toEnable">

//S2 is the new addition here, bind for s3 has been around and works by itself, not with s2
NCRS_bind_to_radio('toEnable', 's2', true, true)
NCRS_bind_to_radio('toEnable', 's3', true, true)


function NCRS_bind_to_checkbox(input, checkbox, required, autofocus){ 
    // Bind an input to a checkbox. 
    // i.e., the input is disabled until the checkbox is checked
    // If "required", then "validate-required" is added/removed as needed. 
    // If "autofocus", then when the checkbox is checked, this field
    // automatically gets focus. 
    if (typeof checkbox == "string") {
        checkbox=document.getElementById(checkbox);
    }
    if (typeof input == "string") {
        input = document.getElementById(input);
    }

    YAHOO.util.Dom.removeClass(input, 'validate-required');
    if (required) { 
        YAHOO.util.Event.addListener(input, "blur", 
                NCRS_forms_passive_check_text, input, true)
    }

    input.disabled = !checkbox.checked;

    // Set initial state of "validate-required"
    if (checkbox.checked && required) { 
        YAHOO.util.Dom.addClass(input, 'validate-required');
    }

    // Add a "click" listener to the checkbox/radio
    YAHOO.util.Event.addListener(checkbox, "click", function() { 
        if (checkbox.checked) { 
            input.disabled = false;
            if (autofocus) { 
                input.focus();
            }
            if (required) { 
                YAHOO.util.Dom.addClass(input, 'validate-required');
            }
        } else { 
            NCRS_forms_set_error(input, true)
            YAHOO.util.Dom.removeClass(input, 'validate-required');
            input.disabled = true;
        }
    });

    // If parent is a "radio" input, also add listeners to sibling radios. 
    if (checkbox.type == 'radio') {
        var item;
        for (var i=0; i < checkbox.form[checkbox.name].length; i++) {
            item = checkbox.form[checkbox.name][i]
            if (item != checkbox) {
                // Add a "click" listener to the checkbox/radio
                YAHOO.util.Event.addListener(item, "click", function() { 
                    if (!checkbox.checked) { 
                        NCRS_forms_set_error(input, true)
                        YAHOO.util.Dom.removeClass(input, 'validate-required');
                        input.disabled = true;
                    }
                })
            }
        }
    }

    // Add a "click" listener to the dependent input.
    // This was intended to re-enabled a disabled input,
    // but doesn't work?
    YAHOO.util.Event.addListener(input, "click", function() {
        if (!checkbox.checked) { 
            checkbox.click();
            input.focus();                
        }
    });
}

NCRS_bind_to_radio = NCRS_bind_to_checkbox

一,
二,
三,

//S2是这里的新添加，s3的绑定已经存在，并且是单独工作的，而不是S2
NCRS绑定到无线电（'toEnable'，'s2'，true，true）
NCRS绑定到无线电（'toEnable'，'s3'，true，true）
函数NCRS\u将\u绑定到\u复选框（输入、复选框、必需、自动对焦）{
//将输入绑定到复选框。
//即，在选中复选框之前，输入被禁用
//如果“需要”，则根据需要添加/删除“需要验证”。
//如果为“自动对焦”，则选中复选框时，此字段
//自动获得焦点。
如果（类型复选框==“字符串”）{
复选框=document.getElementById（复选框）；
}
如果（输入类型=“字符串”）{
输入=document.getElementById（输入）；
}
removeClass（输入'validate required'）；
如有需要{
YAHOO.util.Event.addListener（输入，“blur”，
NCRS\u表格\u被动\u检查\u文本，输入，真）
}
input.disabled=！checkbox.checked；
//将初始状态设置为“需要验证”
如果（checkbox.checked&&required）{
YAHOO.util.Dom.addClass（输入'validate required'）；
}
//将“单击”侦听器添加到复选框/收音机
YAHOO.util.Event.addListener（复选框“单击”，函数（）{
如果（复选框.选中）{
input.disabled=false；
如果（自动对焦）{
input.focus（）；
}
如有需要{
YAHOO.util.Dom.addClass（输入'validate required'）；
}
}否则{
NCRS表格设置错误（输入，真）
removeClass（输入'validate required'）；
input.disabled=true；
}
});
//如果父项是“无线电”输入，还可以将侦听器添加到同级无线电。
如果（checkbox.type=='radio'）{
var项目；
对于（var i=0；i

问题在于，当选择一个单选按钮时，其他单选按钮将被取消选择。我相信，当您选择S3时，输入会短暂启用，然后S2的取消选择会禁用输入

我将修改该方法以获取一组输入，并更改这段代码：

if (!checkbox.checked)
{ 
  NCRS_forms_set_error(input, true)
  YAHOO.util.Dom.removeClass(input, 'validate-required');
  input.disabled = true;
}

例如：

var state = true;
for (radio in radioArray)
{
  state = state && !radio.checked;
}

if (state)
{ 
  NCRS_forms_set_error(input, true)
  YAHOO.util.Dom.removeClass(input, 'validate-required');
  input.disabled = true;
}

我已经和YUI合作过一段时间了，让我为您提供一个简化代码的技巧。而不是这样做：

if (typeof checkbox == "string")
{
  checkbox=document.getElementById(checkbox);
}
if (typeof input == "string")
{
  input = document.getElementById(input);
}

您可以利用YUI的DOM实用程序

var Dom = YAHOO.util.Dom;

checkbox = Dom.get(checkbox);
input = Dom.get(input);

YUI将检查它是否是一个字符串，并始终为您提供对该元素的引用，即使您将一个元素传递到get（）中

---

保罗

问题在于，当选择一个单选按钮时，其他单选按钮将被取消选择。我相信，当您选择S3时，输入会短暂启用，然后S2的取消选择会禁用输入

我将修改该方法以获取一组输入，并更改这段代码：

if (!checkbox.checked)
{ 
  NCRS_forms_set_error(input, true)
  YAHOO.util.Dom.removeClass(input, 'validate-required');
  input.disabled = true;
}

例如：

var state = true;
for (radio in radioArray)
{
  state = state && !radio.checked;
}

if (state)
{ 
  NCRS_forms_set_error(input, true)
  YAHOO.util.Dom.removeClass(input, 'validate-required');
  input.disabled = true;
}

我已经和YUI合作过一段时间了，让我为您提供一个简化代码的技巧。而不是这样做：

if (typeof checkbox == "string")
{
  checkbox=document.getElementById(checkbox);
}
if (typeof input == "string")
{
  input = document.getElementById(input);
}

您可以利用YUI的DOM实用程序

var Dom = YAHOO.util.Dom;

checkbox = Dom.get(checkbox);
input = Dom.get(input);

YUI将检查它是否是一个字符串，并始终为您提供对该元素的引用，即使您将一个元素传递到get（）中

---

Paul

谢谢我没有考虑过，我现在不能这样做，但我将在短时间内逐步使用firebug查看并实施这些更改。谢谢我没有考虑过，我现在不能这样做，但我将在短时间内逐步使用firebug查看并实施这些更改。