1

我在 html 页面上使用 w2ui 网格。我正在获取带有图像路径+单元格鼠标数据的工具提示。我想从中删除图像路径并对其进行自定义。请参见下面的代码。

页面代码如下：---

 <div id="grid" style="width: 100%; height: 114px; margin-top: 5px;">
                        </div>


function bind(value) {

            var columns;
            records = {

                values: []

            };

            var arrcolumns;
            var arrrecords;
            var count = 0;
            var finalarray = [];
            var bindImgUrl;
            var bindImgTitle;

            if (value == 'BP') {
                arrrecords = new Array(
                     ["1", "01/02/2014", callImage(bindImgUrl, bindImgTitle) + "Siting", "141/78"],
                     ["2", "01/03/2014", callImage(bindImgUrl, bindImgTitle) + "Lying", "142/78"],
                     ["3", "01/04/2014", callImage(bindImgUrl, bindImgTitle) + "Siting", "143/78"],
                     ["4", "01/05/2014", callImage(bindImgUrl, bindImgTitle) + "Siting", "144/78"]
                    )
                coulmns = [
            { field: 'Date1', caption: 'Date/Time', size: '30%' },
            { field: 'Measured', caption: 'Measured', size: '30%' },
            { field: 'sys', caption: 'Systolic/Diastolic', size: '30%' }
            ]

                for (var i = 0; i < arrrecords.length - 1; i++) {

                    switch (arrrecords[i][2].split(">")[1]) {
                        case "Siting":
                            bindImgUrl = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAYCAYAAADzoH0MAAABZklEQVR42u3Tv0sCcRjH8acfJmgQSBhESyBRiwQNRdjQFEKLkzQFBQ01BUU5CIFC0BbU0B/QGAVNDf0aIlqqpaAlApe0ot9qVF7vo0e4wVOvuQdew3Hf53P3ved7IqWrHgFMYhs7WMYQvFKh6hDSpjwMiwym0VguoA2b+NSmNG6Q0+sUoqi1C4jgRRefow9BJPGEL6zDbxeQ1Oa8hhXLhwO9d4Juu4CELsrqqxarBYfVBES12dAn9qITMdzhGxtotQtox64GmPu9xhUeUcA9xnVaJasG/RryZhmhGXaLebgqnQVzRF1YsgQcYwTu8q1Jo0EShUHEJTSzYglYrOYUMoNCAKeSMLIym8qJu8lhQCwTlPjrMwGGLHy8i6fZYYAvMCoDc2mZOruUsb1V51sQ2RKX50g6wmHx+nucBAzr6Mx5P+h/cFFtwAD2LX9cKWUDJiwL12xEyp0Ba8Cf6j/gd4zFr+2ofgC6ioxXTw/G3QAAAABJRU5ErkJggg==';
                            bindImgTitle = 'Siting';
                            //arrrecords[i][2] = arrrecords[i][2].split("<")[0] + " " + callImage(bindImgUrl, bindImgTitle);
                            arrrecords[i][2] = callImage(bindImgUrl, bindImgTitle) + " " + arrrecords[i][2].split(">")[1];
                            //callImage(bindImgUrl);
                            break;
                        case "Standing":
                            bindImgUrl = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAYCAYAAADOMhxqAAABVUlEQVR42u3STSgEYRzH8T+WteQgiotwsZclxMXLis3NSUp5CeWsnGSzWTvl4OJMKZzWRW2JuwMp2YODZMvFXiwHbMIy4zvbs+00apzcPPWpeZ7n/3veGpF8c8OHCA5xhFW0oVRsrQTDOIdhc4kxa6gAnTjFFzJI4k5967hAj6oVDxbwqlbcQwfasaXG3hBGuRmoxq6aMEMNlqPW4lHN7at+NrCjBtPwWgL1eLAHyhDCu5rYQCtasG651xoqcpfuVa+RO1YCN2pHc+wagyjMbW1+jCCOD8uTZtRCE3DlT7psuGTuqkbqugL0YpbAAbpRnC/WdA9GRTOiWd6hTUtgSn60iN5I4IxiHYaMx56dA4spn4TS99li0+zxk3Ogqmla+sMpmU8kZeXzRALatnNA5FY8lXHpC07K0kuzFLlnfgsEMaD+WFFFjgF7+w/8ScCPqOK3T34DjKiOj8OQProAAAAASUVORK5CYII=';
                            bindImgTitle = 'Standing';
                            //arrrecords[i][2] = arrrecords[i][2].split("<")[0] + " " + callImage(bindImgUrl, bindImgTitle);
                            arrrecords[i][2] = callImage(bindImgUrl, bindImgTitle) + " " + arrrecords[i][2].split(">")[1];
                            break;
                        case "Lying":
                            bindImgUrl = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAMCAYAAAB4MH11AAABWUlEQVR42q3UQShDcRwH8J9lzJDaiBtFYWmxzIFxc3IyDpIiZ5ddRpnYVg4uym1JsYO4qF0oXJxcxMFJdhwpHEjC2vv5/vVT/5Z6rz3/+tR77/f6/f7v9///H5H9UQZuqBdV8uxfhgMGYQl2IA3zEIQKu8nLYRyu4RNYvMM5hKHSToFeuNISv0lydV2AC+hSLw7BdAky8CVJU9AOLbAPeSmUUAX2tFmUIgvdRV92J7FDawVcdUydo0z9EaYGX3H8FvxagQDkJHZk3iKne5ZGNnYpel+g2CvTzIlBntYzxI6lFar369AMTbCltWjVfCkT7KEkbwL/iOcfKJJVu2dAdtDvoj7Bs9wbEusxL+Cf8NJYepsWHlmKnKJoGyJOmIIbbcbKB1zCJLisbMcw1TTmKBTNUOxljpJGHy2zQzsLw7AGB2IFQlaTq+GDReiQk/vXaa6V/ivV+q/iG0jgigi8cNb7AAAAAElFTkSuQmCC';
                            bindImgTitle = 'Lying';
                            //arrrecords[i][2] = arrrecords[i][2].split("<")[0] + " " + callImage(bindImgUrl, bindImgTitle);
                            arrrecords[i][2] = callImage(bindImgUrl, bindImgTitle) + " " + arrrecords[i][2].split(">")[1];
                            break;
                        default: break;

                    }

                    //records.values.push({ recid: arrrecords[i][0], Date1: arrrecords[i][1], Measured: arrrecords[i][2], Image: arrrecords[i][4], sys: arrrecords[i][3] });
                    records.values.push({ recid: arrrecords[i][0], Date1: arrrecords[i][1], Measured: arrrecords[i][2], sys: arrrecords[i][3] });
                }

                bindtable(coulmns, records.values);


            }
            else {
                arrrecords = new Array(
 ["1", "01/02/2014", callImage(bindImgUrl, bindImgTitle) + "Siting", "165cm"],
 ["2", "01/03/2014", callImage(bindImgUrl, bindImgTitle) + "Lying", "185cm"],
 ["3", "01/04/2014", callImage(bindImgUrl, bindImgTitle) + "Siting", "150cm"],
 ["4", "01/05/2014", callImage(bindImgUrl, bindImgTitle) + "Siting", "144cm"]
)
                coulmns = [
            { field: 'Date1', caption: 'Date/Time', size: '30%' },
            { field: 'Measured', caption: 'Measured', size: '30%' },
            { field: 'Height', caption: 'Height', size: '30%' }
          ]

                for (var i = 0; i < arrrecords.length - 1; i++) {

                    switch (arrrecords[i][2].split(">")[1]) {
                        case "Siting":
                            bindImgUrl = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAYCAYAAADzoH0MAAABZklEQVR42u3Tv0sCcRjH8acfJmgQSBhESyBRiwQNRdjQFEKLkzQFBQ01BUU5CIFC0BbU0B/QGAVNDf0aIlqqpaAlApe0ot9qVF7vo0e4wVOvuQdew3Hf53P3ved7IqWrHgFMYhs7WMYQvFKh6hDSpjwMiwym0VguoA2b+NSmNG6Q0+sUoqi1C4jgRRefow9BJPGEL6zDbxeQ1Oa8hhXLhwO9d4Juu4CELsrqqxarBYfVBES12dAn9qITMdzhGxtotQtox64GmPu9xhUeUcA9xnVaJasG/RryZhmhGXaLebgqnQVzRF1YsgQcYwTu8q1Jo0EShUHEJTSzYglYrOYUMoNCAKeSMLIym8qJu8lhQCwTlPjrMwGGLHy8i6fZYYAvMCoDc2mZOruUsb1V51sQ2RKX50g6wmHx+nucBAzr6Mx5P+h/cFFtwAD2LX9cKWUDJiwL12xEyp0Ba8Cf6j/gd4zFr+2ofgC6ioxXTw/G3QAAAABJRU5ErkJggg==';
                            bindImgTitle = 'Siting';
                            //bindImgUrl = 'blueButton.png';
                            arrrecords[i][2] = callImage(bindImgUrl, bindImgTitle) + " " + arrrecords[i][2].split(">")[1];
                            //callImage(bindImgUrl);
                            break;
                        case "Standing":
                            bindImgUrl = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAYCAYAAADOMhxqAAABVUlEQVR42u3STSgEYRzH8T+WteQgiotwsZclxMXLis3NSUp5CeWsnGSzWTvl4OJMKZzWRW2JuwMp2YODZMvFXiwHbMIy4zvbs+00apzcPPWpeZ7n/3veGpF8c8OHCA5xhFW0oVRsrQTDOIdhc4kxa6gAnTjFFzJI4k5967hAj6oVDxbwqlbcQwfasaXG3hBGuRmoxq6aMEMNlqPW4lHN7at+NrCjBtPwWgL1eLAHyhDCu5rYQCtasG651xoqcpfuVa+RO1YCN2pHc+wagyjMbW1+jCCOD8uTZtRCE3DlT7psuGTuqkbqugL0YpbAAbpRnC/WdA9GRTOiWd6hTUtgSn60iN5I4IxiHYaMx56dA4spn4TS99li0+zxk3Ogqmla+sMpmU8kZeXzRALatnNA5FY8lXHpC07K0kuzFLlnfgsEMaD+WFFFjgF7+w/8ScCPqOK3T34DjKiOj8OQProAAAAASUVORK5CYII=';
                            bindImgTitle = 'Standing';
                            //bindImgUrl = 'blueButton.png';
                            //arrrecords[i][2] = arrrecords[i][2].split("<")[0] + " " + callImage(bindImgUrl, bindImgTitle);
                            arrrecords[i][2] = callImage(bindImgUrl, bindImgTitle) + " " + arrrecords[i][2].split(">")[1];
                            break;
                        case "Lying":
                            bindImgUrl = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAMCAYAAAB4MH11AAABWUlEQVR42q3UQShDcRwH8J9lzJDaiBtFYWmxzIFxc3IyDpIiZ5ddRpnYVg4uym1JsYO4qF0oXJxcxMFJdhwpHEjC2vv5/vVT/5Z6rz3/+tR77/f6/f7v9///H5H9UQZuqBdV8uxfhgMGYQl2IA3zEIQKu8nLYRyu4RNYvMM5hKHSToFeuNISv0lydV2AC+hSLw7BdAky8CVJU9AOLbAPeSmUUAX2tFmUIgvdRV92J7FDawVcdUydo0z9EaYGX3H8FvxagQDkJHZk3iKne5ZGNnYpel+g2CvTzIlBntYzxI6lFar369AMTbCltWjVfCkT7KEkbwL/iOcfKJJVu2dAdtDvoj7Bs9wbEusxL+Cf8NJYepsWHlmKnKJoGyJOmIIbbcbKB1zCJLisbMcw1TTmKBTNUOxljpJGHy2zQzsLw7AGB2IFQlaTq+GDReiQk/vXaa6V/ivV+q/iG0jgigi8cNb7AAAAAElFTkSuQmCC';
                            bindImgTitle = 'Lying';
                            //bindImgUrl = 'blueButton.png';
                            arrrecords[i][2] = callImage(bindImgUrl, bindImgTitle) + " " + arrrecords[i][2].split(">")[1];
                            break;
                        default: break;

                    }

                    //records.values.push({ recid: arrrecords[i][0], Date1: arrrecords[i][1], Measured: arrrecords[i][2], Image: arrrecords[i][4], sys: arrrecords[i][3] });
                    records.values.push({ recid: arrrecords[i][0], Date1: arrrecords[i][1], Measured: arrrecords[i][2], Height: arrrecords[i][3] });
                }

                //                for (var i = 0; i < arrrecords.length-1; i++) {
                //                    records.values.push({ recid: arrrecords[i][0], Date1: arrrecords[i][1], Measured: arrrecords[i][2], Height: arrrecords[i][3] });                 
                //                }

                bindtable(coulmns, records.values);
            }



        }
        function bindtable(columns, record) {



            // debugger;

            if (w2ui['grid'] != undefined || w2ui['grid'] != null) {

                w2ui['grid'].destroy();
            }


            $(function () {

                $('#grid').w2grid({

                    name: 'grid',
                    //url: 'data/list.json',
                    //url:'JSON/Array.js',
                    columns: coulmns,
                    //total: 4,
                    records: record,
                    onShow: null,
                    onClick: function (event) {

                        document.location.href = "https://www.google.com", "_blank";

                    }


                });




            });
        }

        function callImage(url, title) {

            //var doc = ("<img src="+url+">");
            var doc = ("<img src='" + url + "' title='" + title + "' height='18px' width='18px'>");
            return doc;
        }

谢谢 。

4

1 回答 1

1

您有 2 个选项：

一、设置grid.show.recordTitles = false

$().w2grid({
    name: 'grid',
    show: {
        recordTitles: false
    }
    ... 
}

在此处查看更多信息：http ://w2ui.com/web/docs/w2grid.show

二、为列定义自定义标题，可以是文本或函数。如果它是空的，它将把标题全部隐藏起来。

$().w2grid({
    name: 'grid',
    columns: [
        { field: 'some', caption: 'Caption', title: '' }
    ]
    ... 
}

http://w2ui.com/web/docs/w2grid.columns

于 2014-07-20T23:36:58.070 回答