HTML JavaScript 字符串转 SQL In

崇文馆居士

已于 2024-01-18 09:35:14 修改

阅读量398

点赞数 6

文章标签： javascript sql 前端

于 2024-01-03 15:15:18 首次发布

本文链接：https://blog.csdn.net/qq_34677276/article/details/135364671

版权

把从Excel粘贴的内容，转为sql语句可以用的格式。

如何使用（以下内容对小白）：
新建txt文档，改为html后缀，用记事本打开，粘贴后面的代码进去，再用浏览器打开即可使用。
在这里插入图片描述

<!DOCTYPE html>  
<html lang="en">  
<head>  
    <meta charset="UTF-8">  
    <meta name="viewport" content="width=device-width, initial-scale=1.0">  
    <title>字符串转SQL In</title>  
    <style>  
        .container {  
            display: flex;  
            justify-content: space-between;  
            align-items: flex-start;  
        }  
        .input-area, .output-area {  
            flex: 1;  
            margin: 10px; 
        }  
        .button-area {  
            display: flex;  
            justify-content: center;  
            align-items: center;  
            flex-direction: column;  
        } 
        .input-float {  
            width: 60%;  
            box-sizing: border-box; /* Include padding and border in the element's total width */ 
            float: right;  
        }
        .output-float { 
            width: 60%;  
            box-sizing: border-box; /* Include padding and border in the element's total width */  
            float: left;  
        }
        textarea {  
            width: 60%;  
            box-sizing: border-box; /* Include padding and border in the element's total width */ 
            float: right; 
        }  
        .clear-button {  
            margin-top: 100px; /* Move the button up */  
        } 
        .convert-button {  
            margin-top: 50px; /* Move the button up */  
        } 
    </style>  
</head>  
<body>  
    <div class="container">  
        <div class="input-area">  
            <textarea class="input-float" id="inputText" rows="30" cols="40" style="background-color: azure;font-size: 16px;"></textarea>  
        </div>  
        <div class="button-area">  
            <button onclick="convertToSqlInFormat()" class="convert-button" style="width: 100px;height: 50px;">转换并复制</button>  
            <button onclick="clearInputOutput()" class="clear-button" style="width: 100px;height: 50px;">清除</button>  
        </div> 
        <div class="output-area">  
            <textarea class="output-float" id="outputText" rows="30" cols="40" style="background-color: cornsilk;font-size: 16px;"></textarea>  
        </div>  
    </div>  
    <script>  
        function convertToSqlInFormat() {  
            const input = document.getElementById('inputText').value.trim();  
            const lines = input.split('\n').map(line => line.trim());  
            const sqlValues = lines.map(value => `'${value}'`).join(', \n');  
            const sqlInClause = `IN (${sqlValues})`;  
            document.getElementById('outputText').value = sqlInClause;  
            navigator.clipboard.writeText(sqlInClause);
        }  
        function clearInputOutput() {  
            document.getElementById('inputText').value = '';  
            document.getElementById('outputText').value = '';  
        }
    </script>  
</body>  
</html>