Question

我一直在为此寻找解决方案，所以我希望你能提供帮助。

我正在使用Ryan Fait的自定义表单元素，它允许您设置样式复选框和单选按钮等。

唯一的问题是我不能再使用onClick事件，因为实际的盒子会被一个带有自定义无线电元素的图像覆盖。

javascript确实改变了单选按钮，但我似乎无法找到检测更改的方法..

目前，我试过这个：

    Event.observe(window, 'load', function() {
    $('startquestion').observe('change', set_startanswer(this.value));  
});

HTML：

    <p>
<input type="radio" class="styled" name="startanswer" id="startquestion" value="'.$startq['id'].'" onclick="if (this.checked == true) { set_startanswer(this.value); }"'.$s.'> <span id="startanswertext'.$startq['id'].'">'.$startq['question'].'</span>
    </p>

虽然它似乎没有起作用。

任何人都可以帮助我吗？

干杯！丹尼

Answer 1

在Radio列表中观察更改事件的最简单方法：

Form.getInputs('form','radio','radio_name').find(function(radio){

            Event.observe(radio, 'change', function() {

              //do whatever on this change

            });

        });

Answer 2

您使用的脚本会隐藏原始复选框并在上方显示一些自定义图形。它会记录图形上的点击并相应地设置隐藏的复选框 - 但以编程方式设置复选框状态不会触发更改事件。

要解决此问题，您可以明确地捕获自定义图形的点击（该脚本会创建一个包装p元素）。使用上面的代码行：

Event.observe(window, 'load', function() {
    var startquestionElement = $('startquestion');
    var startquestionState = startquestionElement.checked;
    startquestionElement.up().observe('click', function() {
        if (startquestionElement.checked != startquestionState) {
            startquestionState = startquestionElement.checked;
            set_startanswer(startquestionElement.value); // are you sure you want to use the element's value and not it's checked state?
        }
    });  
});

另一种选择是通过使用计时器全局观察复选框状态并检查例如每100毫秒：

Event.observe(window, 'load', function() {
    var startquestionElement = $('startquestion');
    var startquestionState = startquestionElement.checked;
    var observingInterval = setInterval(function() {
        if (startquestionElement.checked != startquestionState) {
            // If you want to stop observing after the checkbox has changed it's state once,
            // uncomment the following line:
            // clearInterval(observingInterval);
            startquestionState = startquestionElement.checked;
            set_startanswer(startquestionElement.value); // are you sure you want to use the element's value and not it's checked state?
        }
    }, 100);  
});

您可以使用后一版本在一个观察函数调用中检查多个复选框。

Answer 3

您可以在event.simulate.js中加入protolicious，然后直接在图片元素上触发本机点击事件。

$('id_of_button').simulate('click');

原型，听取单选按钮的变化

3 个答案: