如何将单选button的值导出到Excel
好的,所以我有一个表格,表格中的一些列有单选button,我已经用1到10的值标记了,我也有一个“导出到Excel”button,把这个表格导出到Excel文件,但是,当它导出时,它将导出每个有单选button的列中所有单选button的值,我只是希望它导出每列中选中的单选button的值,而不是每个列中所有单选button的值列哦,顺便说一下,“导出到Excel”button在堆栈溢出的预览中不起作用,所以你只需要复制代码,如果你想要的工作,并将其保存为一个程序在硬盘上,反正这是我的代码,谢谢你的时间来尝试解决这个问题:
var overall= $('#overall'); $(document).ready(function() { $(':radio').change(function() { var row = $(this).closest('.item'); var checkedItems = row.find(":checked") if (checkedItems.length == 6) { row.find("td.overall").html(getOverall(checkedItems)); } }) function getOverall(_checkedItems) { var total = 0; _checkedItems.each(function() { total += parseFloat($(this).val()); }); return total; } }); var tableToExcel = (function() { var uri = 'data:application/vnd.ms-excel;base64,' , template = '<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40"><head><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}<\/x:Name><x:WorksheetOptions><x:DisplayGridlines/><\/x:WorksheetOptions><\/x:ExcelWorksheet><\/x:ExcelWorksheets><\/x:ExcelWorkbook><\/xml><![endif]--><\/head><body><table>{table}<\/table><\/body><\/html>' , base64 = function(s) { return window.btoa(unescape(encodeURIComponent(s))) } , format = function(s, c) { return s.replace(/{(\w+)}/g, function(m, p) { return c[p]; }) } return function(table, name) { if (!table.nodeType) table = document.getElementById(table) var ctx = {worksheet: name || 'Worksheet', table: table.innerHTML} window.location.href = uri + base64(format(template, ctx)) } })()
table { font-family: arial, sans-serif; border-collapse: collapse; width: 115%; } td, th { border: 1px solid #dddddd; text-align: left; padding: 5px; text-align: center } tr:nth-child(even) { background-color: #dddddd; } div { padding-top: 10px; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table id="copyTable"> <thead> <tr> <th>Team</th> <th>Player</th> <th>Number</th> <th>Skating</th> <th>Shooting</th> <th>Passing</th> <th>Puck Control</th> <th>Team Play</th> <th>Attendance</th> <th>Overall</th> </tr> </thead> <tbody> <tr class="item" data-id="1"> <td></td> <td></td> <td></td> <td> <form action=""> <input type="radio" name="skating" value="1">1 <input type="radio" name="skating" value="2">2 <input type="radio" name="skating" value="3">3 <input type="radio" name="skating" value="4">4 <input type="radio" name="skating" value="5">5 <br> <input type="radio" name="skating" value="6">6 <input type="radio" name="skating" value="7">7 <input type="radio" name="skating" value="8">8 <input type="radio" name="skating" value="9">9 <input type="radio" name="skating" value="10">10 </form> </td> <td> <form action=""> <input type="radio" name="shooting" value="1">1 <input type="radio" name="shooting" value="2">2 <input type="radio" name="shooting" value="3">3 <input type="radio" name="shooting" value="4">4 <input type="radio" name="shooting" value="5">5 <br> <input type="radio" name="shooting" value="6">6 <input type="radio" name="shooting" value="7">7 <input type="radio" name="shooting" value="8">8 <input type="radio" name="shooting" value="9">9 <input type="radio" name="shooting" value="10">10 </form> </td> <td> <form action=""> <input type="radio" name="passing" value="1">1 <input type="radio" name="passing" value="2">2 <input type="radio" name="passing" value="3">3 <input type="radio" name="passing" value="4">4 <input type="radio" name="passing" value="5">5 <br> <input type="radio" name="passing" value="6">6 <input type="radio" name="passing" value="7">7 <input type="radio" name="passing" value="8">8 <input type="radio" name="passing" value="9">9 <input type="radio" name="passing" value="10">10 </form> </td> <td> <form action=""> <input type="radio" name="puck_control" value="1">1 <input type="radio" name="puck_control" value="2">2 <input type="radio" name="puck_control" value="3">3 <input type="radio" name="puck_control" value="4">4 <input type="radio" name="puck_control" value="5">5 <br> <input type="radio" name="puck_control" value="6">6 <input type="radio" name="puck_control" value="7">7 <input type="radio" name="puck_control" value="8">8 <input type="radio" name="puck_control" value="9">9 <input type="radio" name="puck_control" value="10">10 </form> </td> <td> <form action=""> <input type="radio" name="team_play" value="1">1 <input type="radio" name="team_play" value="2">2 <input type="radio" name="team_play" value="3">3 <input type="radio" name="team_play" value="4">4 <input type="radio" name="team_play" value="5">5 <br> <input type="radio" name="team_play" value="6">6 <input type="radio" name="team_play" value="7">7 <input type="radio" name="team_play" value="8">8 <input type="radio" name="team_play" value="9">9 <input type="radio" name="team_play" value="10">10 </form> </td> <td> <form action=""> <input type="radio" name="attendance" value="1">1 <input type="radio" name="attendance" value="2">2 <input type="radio" name="attendance" value="3">3 <input type="radio" name="attendance" value="4">4 <input type="radio" name="attendance" value="5">5 <br> <input type="radio" name="attendance" value="6">6 <input type="radio" name="attendance" value="7">7 <input type="radio" name="attendance" value="8">8 <input type="radio" name="attendance" value="9">9 <input type="radio" name="attendance" value="10">10 </form> </td> <td class="overall" id="overall"> </td> </tr> <tr class="item" data-id="2"> <td></td> <td></td> <td></td> <td> <form action=""> <input type="radio" name="skating" value="1">1 <input type="radio" name="skating" value="2">2 <input type="radio" name="skating" value="3">3 <input type="radio" name="skating" value="4">4 <input type="radio" name="skating" value="5">5 <br> <input type="radio" name="skating" value="6">6 <input type="radio" name="skating" value="7">7 <input type="radio" name="skating" value="8">8 <input type="radio" name="skating" value="9">9 <input type="radio" name="skating" value="10">10 </form> </td> <td> <form action=""> <input type="radio" name="shooting" value="1">1 <input type="radio" name="shooting" value="2">2 <input type="radio" name="shooting" value="3">3 <input type="radio" name="shooting" value="4">4 <input type="radio" name="shooting" value="5">5 <br> <input type="radio" name="shooting" value="6">6 <input type="radio" name="shooting" value="7">7 <input type="radio" name="shooting" value="8">8 <input type="radio" name="shooting" value="9">9 <input type="radio" name="shooting" value="10">10 </form> </td> <td> <form action=""> <input type="radio" name="passing" value="1">1 <input type="radio" name="passing" value="2">2 <input type="radio" name="passing" value="3">3 <input type="radio" name="passing" value="4">4 <input type="radio" name="passing" value="5">5 <br> <input type="radio" name="passing" value="6">6 <input type="radio" name="passing" value="7">7 <input type="radio" name="passing" value="8">8 <input type="radio" name="passing" value="9">9 <input type="radio" name="passing" value="10">10 </form> </td> <td> <form action=""> <input type="radio" name="puck_control" value="1">1 <input type="radio" name="puck_control" value="2">2 <input type="radio" name="puck_control" value="3">3 <input type="radio" name="puck_control" value="4">4 <input type="radio" name="puck_control" value="5">5 <br> <input type="radio" name="puck_control" value="6">6 <input type="radio" name="puck_control" value="7">7 <input type="radio" name="puck_control" value="8">8 <input type="radio" name="puck_control" value="9">9 <input type="radio" name="puck_control" value="10">10 </form> </td> <td> <form action=""> <input type="radio" name="team_play" value="1">1 <input type="radio" name="team_play" value="2">2 <input type="radio" name="team_play" value="3">3 <input type="radio" name="team_play" value="4">4 <input type="radio" name="team_play" value="5">5 <br> <input type="radio" name="team_play" value="6">6 <input type="radio" name="team_play" value="7">7 <input type="radio" name="team_play" value="8">8 <input type="radio" name="team_play" value="9">9 <input type="radio" name="team_play" value="10">10 </form> </td> <td> <form action=""> <input type="radio" name="attendance" value="1">1 <input type="radio" name="attendance" value="2">2 <input type="radio" name="attendance" value="3">3 <input type="radio" name="attendance" value="4">4 <input type="radio" name="attendance" value="5">5 <br> <input type="radio" name="attendance" value="6">6 <input type="radio" name="attendance" value="7">7 <input type="radio" name="attendance" value="8">8 <input type="radio" name="attendance" value="9">9 <input type="radio" name="attendance" value="10">10 </form> </td> <td class="overall" id="overall"> </td> </tr> </tbody> </table> <div align="center"> <input type="button" onclick="tableToExcel('copyTable')" value="Export to Excel"> </div>
这是一个小黑客,但我认为我有它的工作请注意,我包裹的广播后的广播input文本
我所做的是克隆表隐藏div删除所有未经检查的单选button,然后使用该Excel文件,然后删除克隆的项目
var overall = $('#overall'); $(document).ready(function() { $(':radio').change(function() { var row = $(this).closest('.item'); var checkedItems = row.find(":checked") if (checkedItems.length == 6) { row.find("td.overall").html(getOverall(checkedItems)); } }) function getOverall(_checkedItems) { var total = 0; _checkedItems.each(function() { total += parseFloat($(this).val()); }); return total; } }); var tableToExcel = (function() { var uri = 'data:application/vnd.ms-excel;base64,', template = '<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40"><head><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}<\/x:Name><x:WorksheetOptions><x:DisplayGridlines/><\/x:WorksheetOptions><\/x:ExcelWorksheet><\/x:ExcelWorksheets><\/x:ExcelWorkbook><\/xml><![endif]--><\/head><body><table>{table}<\/table><\/body><\/html>', base64 = function(s) { return window.btoa(unescape(encodeURIComponent(s))) }, format = function(s, c) { return s.replace(/{(\w+)}/g, function(m, p) { return c[p]; }) } return function(table, name) { if (!table.nodeType) { table = document.getElementById(table)} var cloned = $('#copyTable').clone().appendTo('.hidden_table') cloned.find('input[type="radio"]:not(:checked) + span').remove(); var ctx = { worksheet: name || 'Worksheet', table: cloned.html() } cloned.remove(); window.location.href = uri + base64(format(template, ctx)) } })();
table { font-family: arial, sans-serif; border-collapse: collapse; width: 115%; } td, th { border: 1px solid #dddddd; text-align: left; padding: 5px; text-align: center } tr:nth-child(even) { background-color: #dddddd; } div { padding-top: 10px; } .hidden_table{ /*display:none*/ }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table id="copyTable"> <thead> <tr> <th>Team</th> <th>Player</th> <th>Number</th> <th>Skating</th> <th>Shooting</th> <th>Passing</th> <th>Puck Control</th> <th>Team Play</th> <th>Attendance</th> <th>Overall</th> </tr> </thead> <tbody> <tr class="item" data-id="1"> <td></td> <td></td> <td></td> <td> <form action=""> <input type="radio" name="skating" value="1"><span>1</span> <input type="radio" name="skating" value="2"><span>2</span> <input type="radio" name="skating" value="3"><span>3</span> <input type="radio" name="skating" value="4"><span>4</span> <input type="radio" name="skating" value="5"><span>5</span> <br> <input type="radio" name="skating" value="6"><span>6</span> <input type="radio" name="skating" value="7"><span>7</span> <input type="radio" name="skating" value="8"><span>8</span> <input type="radio" name="skating" value="9"><span>9</span> <input type="radio" name="skating" value="10"><span>10</span> </form> </td> <td> <form action=""> <input type="radio" name="shooting" value="1"><span>1</span> <input type="radio" name="shooting" value="2"><span>2</span> <input type="radio" name="shooting" value="3"><span>3</span> <input type="radio" name="shooting" value="4"><span>4</span> <input type="radio" name="shooting" value="5"><span>5</span> <br> <input type="radio" name="shooting" value="6"><span>6</span> <input type="radio" name="shooting" value="7"><span>7</span> <input type="radio" name="shooting" value="8"><span>8</span> <input type="radio" name="shooting" value="9"><span>9</span> <input type="radio" name="shooting" value="10"><span>10</span> </form> </td> <td> <form action=""> <input type="radio" name="passing" value="1"><span>1</span> <input type="radio" name="passing" value="2"><span>2</span> <input type="radio" name="passing" value="3"><span>3</span> <input type="radio" name="passing" value="4"><span>4</span> <input type="radio" name="passing" value="5"><span>5</span> <br> <input type="radio" name="passing" value="6"><span>6</span> <input type="radio" name="passing" value="7"><span>7</span> <input type="radio" name="passing" value="8"><span>8</span> <input type="radio" name="passing" value="9"><span>9</span> <input type="radio" name="passing" value="10"><span>10</span> </form> </td> <td> <form action=""> <input type="radio" name="puck_control" value="1"><span>1</span> <input type="radio" name="puck_control" value="2"><span>2</span> <input type="radio" name="puck_control" value="3"><span>3</span> <input type="radio" name="puck_control" value="4"><span>4</span> <input type="radio" name="puck_control" value="5"><span>5</span> <br> <input type="radio" name="puck_control" value="6"><span>6</span> <input type="radio" name="puck_control" value="7"><span>7</span> <input type="radio" name="puck_control" value="8"><span>8</span> <input type="radio" name="puck_control" value="9"><span>9</span> <input type="radio" name="puck_control" value="10"><span>10</span> </form> </td> <td> <form action=""> <input type="radio" name="team_play" value="1"><span>1</span> <input type="radio" name="team_play" value="2"><span>2</span> <input type="radio" name="team_play" value="3"><span>3</span> <input type="radio" name="team_play" value="4"><span>4</span> <input type="radio" name="team_play" value="5"><span>5</span> <br> <input type="radio" name="team_play" value="6"><span>6</span> <input type="radio" name="team_play" value="7"><span>7</span> <input type="radio" name="team_play" value="8"><span>8</span> <input type="radio" name="team_play" value="9"><span>9</span> <input type="radio" name="team_play" value="10"><span>10</span> </form> </td> <td> <form action=""> <input type="radio" name="attendance" value="1"><span>1</span> <input type="radio" name="attendance" value="2"><span>2</span> <input type="radio" name="attendance" value="3"><span>3</span> <input type="radio" name="attendance" value="4"><span>4</span> <input type="radio" name="attendance" value="5"><span>5</span> <br> <input type="radio" name="attendance" value="6"><span>6</span> <input type="radio" name="attendance" value="7"><span>7</span> <input type="radio" name="attendance" value="8"><span>8</span> <input type="radio" name="attendance" value="9"><span>9</span> <input type="radio" name="attendance" value="10"><span>10</span> </form> </td> <td class="overall" id="overall"> </td> </tr> <tr class="item" data-id="2"> <td></td> <td></td> <td></td> <td> <form action=""> <input type="radio" name="skating" value="1"><span>1</span> <input type="radio" name="skating" value="2"><span>2</span> <input type="radio" name="skating" value="3"><span>3</span> <input type="radio" name="skating" value="4"><span>4</span> <input type="radio" name="skating" value="5"><span>5</span> <br> <input type="radio" name="skating" value="6"><span>6</span> <input type="radio" name="skating" value="7"><span>7</span> <input type="radio" name="skating" value="8"><span>8</span> <input type="radio" name="skating" value="9"><span>9</span> <input type="radio" name="skating" value="10"><span>10</span> </form> </td> <td> <form action=""> <input type="radio" name="shooting" value="1"><span>1</span> <input type="radio" name="shooting" value="2"><span>2</span> <input type="radio" name="shooting" value="3"><span>3</span> <input type="radio" name="shooting" value="4"><span>4</span> <input type="radio" name="shooting" value="5"><span>5</span> <br> <input type="radio" name="shooting" value="6"><span>6</span> <input type="radio" name="shooting" value="7"><span>7</span> <input type="radio" name="shooting" value="8"><span>8</span> <input type="radio" name="shooting" value="9"><span>9</span> <input type="radio" name="shooting" value="10"><span>10</span> </form> </td> <td> <form action=""> <input type="radio" name="passing" value="1"><span>1</span> <input type="radio" name="passing" value="2"><span>2</span> <input type="radio" name="passing" value="3"><span>3</span> <input type="radio" name="passing" value="4"><span>4</span> <input type="radio" name="passing" value="5"><span>5</span> <br> <input type="radio" name="passing" value="6"><span>6</span> <input type="radio" name="passing" value="7"><span>7</span> <input type="radio" name="passing" value="8"><span>8</span> <input type="radio" name="passing" value="9"><span>9</span> <input type="radio" name="passing" value="10"><span>10</span> </form> </td> <td> <form action=""> <input type="radio" name="puck_control" value="1"><span>1</span> <input type="radio" name="puck_control" value="2"><span>2</span> <input type="radio" name="puck_control" value="3"><span>3</span> <input type="radio" name="puck_control" value="4"><span>4</span> <input type="radio" name="puck_control" value="5"><span>5</span> <br> <input type="radio" name="puck_control" value="6"><span>6</span> <input type="radio" name="puck_control" value="7"><span>7</span> <input type="radio" name="puck_control" value="8"><span>8</span> <input type="radio" name="puck_control" value="9"><span>9</span> <input type="radio" name="puck_control" value="10"><span>10</span> </form> </td> <td> <form action=""> <input type="radio" name="team_play" value="1"><span>1</span> <input type="radio" name="team_play" value="2"><span>2</span> <input type="radio" name="team_play" value="3"><span>3</span> <input type="radio" name="team_play" value="4"><span>4</span> <input type="radio" name="team_play" value="5"><span>5</span> <br> <input type="radio" name="team_play" value="6"><span>6</span> <input type="radio" name="team_play" value="7"><span>7</span> <input type="radio" name="team_play" value="8"><span>8</span> <input type="radio" name="team_play" value="9"><span>9</span> <input type="radio" name="team_play" value="10"><span>10</span> </form> </td> <td> <form action=""> <input type="radio" name="attendance" value="1"><span>1</span> <input type="radio" name="attendance" value="2"><span>2</span> <input type="radio" name="attendance" value="3"><span>3</span> <input type="radio" name="attendance" value="4"><span>4</span> <input type="radio" name="attendance" value="5"><span>5</span> <br> <input type="radio" name="attendance" value="6"><span>6</span> <input type="radio" name="attendance" value="7"><span>7</span> <input type="radio" name="attendance" value="8"><span>8</span> <input type="radio" name="attendance" value="9"><span>9</span> <input type="radio" name="attendance" value="10"><span>10</span> </form> </td> <td class="overall" id="overall"> </td> </tr> </tbody> </table> <div class="hidden_table" id="hidden_table"></div> <div align="center"> <input type="button" onclick="tableToExcel('copyTable', 'Player_scores')" value="Export to Excel"> </div>