2011-05-09 85 views
0

我試圖從使用YQL的另一個網站上的表格檢索數據,並使用jQuery在我的網站上的表單中顯示數據。我已經成功地檢索數據並將其顯示在我的網站上,但是,我不確定從哪裏開始將數據放入我的表單輸入。將html表格數據轉換爲使用jQuery的形式

被檢索的數據是這樣的:

<table> 
    <tbody> 
     <tr class=""> 
      <td class="nobr"> 
       <a href="/player-26164302" title="View player profile">C Borup</a> 
      </td> 
      <td class="num IP"> 
       <p>0.2</p> 
      </td> 
      <td class="num H:pitching"> 
       <p>2</p> 
      </td> 
      [...] 
     </tr> 
    </tbody> 
</table> 

我想我可以在這一點上做1 2的東西。
1)嘗試將此表中的p標籤轉換爲輸入,但同樣重要的是,我需要將td中的類應用於輸入。 2)從表中的p標籤中檢索值,並將其放置在基於td類的現有表單中(這可能嗎?)。

我的jQuery來檢索和顯示數據是這樣的:

jQuery("#bbnuke_retrieve_gamechanger_results_btn_id").bind('click', function() { 
    var gameID = jQuery("#bbnuke_plugin_gamechanger_import").val(); 
    var pitchLink = 'http://www.gamechanger.io/game-' + gameID + '/boxscore/pitching/standard'; 
    var yql = 'http://query.yahooapis.com/v1/public/yql?q=' + encodeURIComponent('select tbody FROM html where url ="' + pitchLink + '" and xpath="//table[@id=' + "'tbl_home_pitching'" + ']"') + '&format=xml&callback=?'; 
    jQuery.getJSON(yql, cbFunc); 

    function cbFunc(data) { 
     if (data.results[0]) { 
      data = data.results[0].replace(/<script[^>]*>[\s\S]*?<\/script>/gi, ''); 
      jQuery("#gamesitedump").html(data); 
     } 
     else { 
      jQuery("#gamesitedump").html("Error"); 
      throw new Error('Nothing returned from getJSON.'); 
     } 
    } 
}); 

任何幫助,非常感謝!

回答

2

你可以 「轉換」 的<p><input>這樣:

$("td > p").each(function() { 
    // creates a new <input> element 
    $newInput = $("<input type='text'/>"); 
    // find the parent of the current <p>, and applies its class to the new <input> 
    $newInput.addClass($(this).parent().attr("class")); 
    // get the value of the current <p>, and set the value of the new <input> to this 
    $newInput.val($(this).text()); 
    // replace the current <p> element with its <input> equivalent 
    $(this).replaceWith($newInput); 
}); 

你可以找到一個jsFiddle example here