jqueryを使用してハイパーリンクを持つキー値テーブルに 'a href'行を追加

Question

次の表は、列名と関連プロパティのキー値（すべてのテキスト）テーブルを作成します。特別なケースを作成して、残りのテキストの代わりに 'url'列の値のハイパーリンクを確保するにはどうすればよいですか。私はこのような何かを試してみました

以下で

...

var table = $("<table><tr><th>Column</th><th>Value</th></tr></table>"); 
var keys = Object.keys(properties); 
var banProperties = ['geom']; 
**var url = ['url'];** 
for (var k = 0; k < keys.length; k++) { 
    if (banProperties.indexOf(keys[k]) === -1) { 
    var row = $("<tr></tr>"); 
    row.append($("<td></td>").text(keys[k])); 
    row.append($("<td></td>").text(properties[keys[k]])); 

    //Add conditional statment here to ensure href instead of text 
    // on column 'url' 

    table.append(row); 
    } 
} 

私はこれを取得... ...次のような結果が生成さ

var table = $("<table><tr><th>Column</th><th>Value</th></tr></table>"); 
var keys = Object.keys(properties); 
var banProperties = ['geom']; 
var url = ['url']; 
for (var k = 0; k < keys.length; k++) { 
    if (banProperties.indexOf(keys[k]) === -1) { 
    var row = $("<tr></tr>"); 
    row.append($("<td></td>").text(keys[k])); 
    //row.append($("<td></td>").text(properties[keys[k]])); 
    row.append($("<td></td>").html('<a href="#">Foo</a>')); 
    table.append(row); 
    } 
} 

。 ..

「url」フィールドにのみハイパーリンクを作成するためにこれらのメソッドを組み合わせるにはどうすればよいですか？

Answer 1

チェック現在の列がURLの場合：

var row = $("<tr></tr>"); 
row.append($("<td></td>").text(keys[k])); 
if (keys[k]=='url'){  
    row.append($("<td></td>").html('<a href="'+properties[keys[k]]+'">'+properties[keys[k]]+'</a>')); 
} 
else{ 
    row.append($("<td></td>").text(properties[keys[k]])); 
} 
table.append(row); 

Answer 2

それはのような検出された場合、次のコードは、自動的に、URLとして任意の値をレンダリングするでしょう（今だけのためのUNCが、あなたは正規表現を拡張することができます） 。

function ValidURL(str) { 
    var pattern = new RegExp('^(\\\\[^/\\\]\[":;|<>+=,?* _]+\\[^/\\\]\[":;|<>+=,?*]+)((?:\\[^\\/:*?"<>|]+)*\\?)$','i'); 
    if(!pattern.test(str)) { 
    return false; 
    } else { 
    return true; 
    } 
} 

var table = $("<table><tr><th>Column</th><th>Value</th></tr></table>"); 
var keys = Object.keys(properties); 
var banProperties = ['geom']; 

for (var k = 0; k < keys.length; k++) { 
    if (banProperties.indexOf(keys[k]) === -1) { 
    var row = $("<tr></tr>"); 
    row.append($("<td></td>").text(keys[k])); 

    if (ValidURL(properties[keys[k]]) { 
     row.append($("<td></td>").html('<a href="' + properties[keys[k]] + '">click here</a>')); 
    } else { 
     row.append($("<td></td>").text(properties[keys[k]])); 
    } 

    table.append(row); 
    } 
}