Telerik数字文本框值的jQuery选择答案

【问题标题】：Jquery select of Telerik numeric text box valueTelerik数字文本框值的jQuery选择
【发布时间】：2015-01-14 09:42:11
【问题描述】：

我有一个或多个 Telerik 数字文本框的 MVC 5 视图，每个视图呈现如下：

<span class="k-widget k-numerictextbox">
<span class="k-numeric-wrap k-state-default">
    <input tabindex="0" class="k-formatted-value k-input" aria-disabled="false" aria-readonly="false" style="display: inline-block;" type="text">
    <input name="SelectedMinimumChange" class="k-input" id="SelectedMinimumChange" role="spinbutton" aria-disabled="false" aria-readonly="false" aria-valuenow="10" aria-valuemin="5" aria-valuemax="95" style="display: none;" type="text" min="5" max="95" step="5" value="10" data-role="numerictextbox">
    <span class="k-select">
        <span class="k-link" style="-ms-touch-action: double-tap-zoom pinch-zoom;" unselectable="on">
            <span title="Increase value" class="k-icon k-i-arrow-n" unselectable="on">Increase value
            </span>
        </span>
        <span class="k-link" style="-ms-touch-action: double-tap-zoom pinch-zoom;" unselectable="on">
            <span title="Decrease value" class="k-icon k-i-arrow-s" unselectable="on">Decrease value
            </span>
        </span>
    </span>
</span>

我的任务是获取第二个输入标签中的选定值，保存在属性“值”中（在本示例中为 10）并隐藏控件

获取控件很容易（即使对我来说也是如此）：

$(".k-numerictextbox").each(function () {
      var control = $(this);
      …     try to get the value
      Control.hide();
});

这会找到并隐藏控件。我可以通过以下方式获取特定控件的值：

var displayVal = input.data("kendoNumericTextBox").value()

但是我尝试将足够多的 JQuery 选择器串在一起并没有奏效。我需要从控件转到具有“k-input”类（有 2 个）的子级，然后是具有属性 [data-role] = 'numerictextbox' 的子级，然后在那里获取属性值的值。我在每个循环中尝试了 [很多东西] - 我的最终结果：

var displayVal = control.children(".k-input").find("[data-role]='numerictextbox'")

感觉它在正确的轨道上，但我不知道要添加下一个选择器来获得结果。

谢谢，斯科特

【问题讨论】：

标签： jquery telerik

【解决方案1】：

决定从内到外——这就是有效的方法：

        $("input[type=text][id][data-role=numerictextbox]").each(function () {
        var input = $(this); //the element within the numerictextbox with the id
        var id = input.attr("id"); //get the id
        var control = $("#" + id).data("kendoNumericTextBox"); //get the kendo control from the id
        var displayVal = control.value(); //the value we want to display
        var displayElem = $("<span />"); //new display element
        displayElem.text(displayVal);
        var topControlElement = input.closest(".k-numerictextbox"); //get the root element making up the kendo numerictextbox
        displayElem.insertBefore(topControlElement);
        control.destroy();
        topControlElement.remove();
    });

【讨论】：