Question

利用ASP与DotNetNuke循环遍历重复单选按钮列表。
使用JQuery
目前正在显示weightCalculations函数的适当结果值（例如：3）
如何将rbtCalculations结果与weightCalculations结果结合使用？

Ex：IF rbtCalculations =非常高且weightCalculations =高那么 $（'p.custom'+ ID）.text（“5”）;

<input id="rbt_0" name="rbt" value="Very High" checked="checked" onclick="rbtCalculations(this,6559);" type="radio">
<input id="rbt_1" name="rbt" value="High" onclick="rbtCalculations(this,6559);" type="radio">

<input id="stakeholders_rbt_0" name="stakeholders_rbt" value="Very High" onclick="weightCalculations(this,6559);" type="radio">
<input id="stakeholders_rbt_1" name="stakeholders_rbt" value="High" checked="checked" onclick="weightCalculations(this,6559);" type="radio">
<input id="stakeholders_rbt_2" name="stakeholders_rbt" value="Low to Moderate" onclick="weightCalculations(this,6559);" type="radio">

<p class="custom6559">3</p>

<script type="text/javascript">
    function weightCalculations(value, ID) {
        if (value.value == "High") {
            $('p.custom' + ID).text("3");
        }
        else {
            $('p.custom' + ID).text("2");
        }
}

Answer 1

function weightCalculations(value, ID) {
        if (value.value === "High" && $('input[name="rbt"]').val() === "Very High") {
            $('p.custom' + ID).text("5");
        }
        else if(value.value === "High"){
            $('p.custom' + ID).text("3");
        }
        else {
            $('p.custom' + ID).text("2");
        }
}

Answer 2

我可能只是在单选按钮上添加class来识别它们，并将所有部分关联在一起的包装元素：

<div class="js-weight-calc-wrap">
    <input type="radio" class="js-rbt" ... />
    <input type="radio" class="js-rbt" ... />

    <input type="radio" class="js-weight" ... />
    <input type="radio" class="js-weight" ... />
    <input type="radio" class="js-weight" ... />

    <p class="js-result custom6559"></p>
</div>

<script>
jQuery(document).ready(function ($) {
    $('.js-rbt, .js-weight').change(function () {
        var $this = $(this),
            $wrap = $this.closest('.js-weight-calc-wrap'),
            rbtVal = $wrap.find('.js-rbt:checked').val(),
            weightVal = $wrap.find('.js-weight:checked').val(),
            result = rbtVal === 'VeryHigh' && weightVal === 'High' 
                     ? '5'
                     : rbtVal === 'VeryHigh' && weightVal === 'Low'
                         ? '4'
                         : '0';
        $wrap.find('.js-result').text(result)
    });
});
</script>

我也可能最终创建一个包含所有逻辑的jQuery插件，所以在你的页面上它只是这样的调用：

jQuery(function ($) { 
    $('.js-weight-calc-wrap').weightCalculator({
        rbtSelector: '.js-rbt',
        weightSelector: '.js-weight',
        resultSelector: '.js-result'
    });
});

更新

我之前忘记了你在选择它们时需要过滤单选按钮，这样你只能得到一个选中的按钮（与<select/>元素混淆）。将:select添加到选择器后，它会按预期工作。我把它清理了一下，然后创建了一个working jsFiddle。

结合两个独立功能的结果？

2 个答案:

更新