使用 JavaScript 从 insideHTML 文本字符串获取 selectedIndex

Question

我所拥有的是这个 object.innerHTML ，它是这样的：

<TABLE >
 <TBODY>

  <TR>
   <TD >
      <IMG id=ctl00_Def_ctl00_ucXXXControl_gvGridName_ctl00_ctl05_imgXYZError src="etc/exclamation.png"> 
   </TD>
   <TD>
      <SELECT id=ctl00_Def_ctl00_ucXXXControl_ctl00_ctl05_rcb123 name=ctl00$Def$ctl00$ucXXXControl$gvGridName$ctl00$ctl05$rcb123>
       <OPTION value=0></OPTION> 
       <OPTION value=1>703</OPTION> 
       <OPTION value=3>704</OPTION> 
       <OPTION value=4>801</OPTION> 
       <OPTION value=5>802</OPTION> (etc)
      </SELECT> 
   </TD>
  </TR>
 </TBODY>
</TABLE>

我需要知道如何通过 JavaScript 来使用那个 innerHTML 文本 blob。我如何获得我的选择元素的“selectedIndex”？

如果您想要这部分，则更痛苦的细节是：

我正在使用 RadGrid 控件（来自 Telerik）并使用“内联”编辑选项。所以这个网格包含 X 行，每行有 X 个单元格。细胞的内容物是问题所在。每个细胞都包含“东西”。有些包含一个简单的“输入”元素等，但我需要使用的元素包含一个表定义，该定义本身包含 1 行和 2 个单元格。一个单元格具有图像，另一个单元格具有下拉列表，即“选择”元素。

我的问题是我已经使用了 RadGrid 客户端 API 集，因此我可以深入到单元格。在这一点上，他们并没有真正提供（我能找到的）任何处理该单元格内容的方法......可能是因为内容可以是任何东西。所以我需要弄清楚如何使用这个 HTML 字符串。对于 jQuery 和 JavaScript 来说还是新手...我真的只是想将字符串转换为表对象，然后针对该对象运行 jQuery 选择器...但 JavaScript 并不能真正直接工作...据我所知迄今为止。 :(

Answer 1

$('#ctl00_Def_ctl00_ucXXXControl_ctl00_ctl05_rcb123').val()

将为您提供所选选项的值。

您还希望将 id 和 class 值放在 html 中的引号中。

Answer 2

好吧，我在帖子发布后立即想到的想法最终就是我所使用的，这也是 Shoesbox639 所建议的。我将提取所需 clientID 的代码放入辅助方法中：

    //****************************************************************************************
//* Find a requested control's clientID as the first parm passed in from a string 
//*    passed in as the second parm. 
//****************************************************************************************
    function locateClientID(requestedClientID, HTML_StringToSearch) {
    var returnValue = "";

    //If we have something to search for and something to search in, do so.  Null or "" will fail this check.
    if (requestedClientID && HTML_StringToSearch) {

        //Find the starting point of the string starting with "id=", then any number of other letters, numbers,
        //  or underscores, then ending in the specified "requestedClientID" parm value.  We add three to offset
        //  the "id+" part of the search string, which we don't want in the results, but include to locate value.
        var startingPoint = HTML_StringToSearch.search("id=[a-z0-9A-Z_]*" + requestedClientID) + 3;

        //If we found a valid starting point, i.e. NOT -1, then continue processing the string.
        if (startingPoint > -1) {

            //Now that we know where our clientID for the requested control starts in the passed in string,
            //  find the ending " " so we know how much to substr off to pull out the requested client id.
            var endingPoint = HTML_StringToSearch.indexOf(" ", startingPoint);
            //The endingPoint could be -1 if there is no space after the "id" property, but all the examples
            //  I have seen have more attributes after.

            //substr out the clientID and return it to the caller.
            returnValue = HTML_StringToSearch.substr(startingPoint, (endingPoint - startingPoint));
         }
    }

    return returnValue;
}
//*****************************************************************************************

因此，在我的例子中，我将传入 rcb123 作为第一个参数，将 innerHTML 字符串 blob 作为第二个值，并且该函数将返回 clientID 值。取回 clientID 后，我只是使用它进行另一个 jQuery 方法调用：

function cv123_Validate(sender, eventArgs) {

    //Get a ref to the radGrid's collection of rows.
    var gvRadGridNameRows = $find("<%= gvRadGridName.ClientID %>").MasterTableView.get_dataItems();

    var innerHTML;
    var foundClientID;
    var errorImage;
    var rcb123;

    //Process every row in the radGrid.
    for (var row = 0; row < gvRadGridNameRows.length; row++){
        //Get the cell in question's innerHTML value.
        innerHTML = gvRadGridNameRows.get_cell("uniqueCellName").innerHTML;

        //Get ref to the 'error image'.
        errorImage = $("#" + locateClientID("imgHUDError", innerHTML));

        //locate the unique clientID of the rcb123 in this row.
        foundClientID = locateClientID("rcb123", innerHTML);

        //Use the found unique clientID with jQuery to get a ref to the dropdown list.
        rcb123 = $("#" + foundClientID)[0];

        //If the dropdown list's selected index is 0 or less AND the control is NOT 
        //  disabled, active the single error message tied to this custom validator
        //  and show the 'error image' next to the control.
        if (rcb123.selectedIndex < 1 && rcb123.isDisabled != true) {
            errorImage.css("height", 12);
            eventArgs.IsValid = false;
        }
        else //Otherwise, hide the error image.
        {
            errorImage.css("height", 0);  
        }
    }
}

我仍在测试各种示例，并寻找除所指出的之外的任何漏洞，但就我的目的而言，这效果很好。我创建了辅助例程，因为我还操作了 insideHTML blob 中的图像。

这个想法是在网格中的每个控件旁边放置一个“错误图像”，以直观地参考错误所在的位置，但只向 errorSummary 控件添加一条错误消息，而不是我在简单嵌入时收到的 X 条重复错误消息下拉列表旁边的必填字段验证器。 （我的 BA 小组不喜欢这样......）

希望这可以帮助别人。