个人中心
gpt4 book ai didi

javascript - 有人可以在使用 indexOf、split 然后利用循环将分割粘贴到各个输入时校对我的 javaScript 语法吗？

转载 作者：行者123 更新时间：2023-11-28 20:29:58 30 4
gpt4 key购买 nike

我是一名自学成才、业余爱好的程序员。

我正在尝试构建一个 javaScript/jQuery 工具，该工具允许用户复制 Excel 中的行或列，然后将它们粘贴到在线 html 表单中，该表单由 <textarea> 网格组成。 s。方法是识别复制数据中的分隔符。

我已经冲浪和测试了一段时间了，我觉得我距离实现这一点还差得很远，但我仍然无法让它发挥作用。

我正在测试的示例表单如下:

sample form for testing image

示例数据集可能是这样的:

sample data set to be pasted into the form

我不想说得太长，但我认为最好分享我迄今为止拥有的(几乎)整个代码，以便省略任何奥秘:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
    $('.inputArea').keypress(function(e){
        if (e.which == 13)
        {
            alert ( "Hello.\n \n Please use your mouse or the [TAB] key to advance to other cells.\n \n The [RETURN] key is disabled to prevent premature submissions of the form.\n \n");
            return false;
        }
    });
    $('.inputArea').focus(function() {
        $(this).addClass("InFocus");
   });
    $('.inputArea').blur(function() {
        $(this).removeClass("InFocus");
   });   
    $('.inputArea').keyup(function() {
        var x = $(this).val();
            if (x.indexOf('\t') > 0 && x.indexOf('\n') > 0) {
            alert ("Hello. \n\n At this time, this form does not support \'copy \& paste\' from both columns and rows from a Excel sheet in the same block.\n\nColumns and/or rows must be copied independantly.\n\n");
            $(this).val("");
            return false;
            }
            else
            if (x.indexOf('\t') > 0) {
                var delT = x.split('\t');
                var dit = $(this).attr('data-id');
                for (var i = 0; i < delT.length ; i++)
                $("#dataInput_" + dit[i]).val(delT[i]);

             }
             else
             if (x.indexOf('\n') > 0) {
                 var delN = x.split('\n');
                 var din = $(this).attr('data-id');
                 for (var i = 0; i < delN.length ; i++) 
                 $("#dataInput_" + din[i]).val(delN[i]);
                 din += 4;

             }
                     return false;
   });
})
</script>



    <style>
        <!--I will skip the styling code-->
    </style>
</head>
<body>
    <form name="simpleForm02">
        <table>
            <tr>
                <th>Color</th>
                <th>Model</th>
                <th>Qty</th>
                <th>Cost</th>
            </tr>
            <tr>
                <td><textarea data-id="1" class="inputArea colorInput" id="dataInput_1" name="colorInput_row_1" onKeyUp="" ></textarea></td>
                <td><textarea data-id="2" class="inputArea modelInput" id="dataInput_2" name="modelInput_row_1" onKeyUp=""></textarea></td>
                <td><textarea data-id="3" class="inputArea qtyInput" id="dataInput_3" name="qtyInput_row_1" onKeyUp=""></textarea></textarea></td>
                <td><textarea data-id="4" class="inputArea costInput" id="dataInput_4" name="costInput_row_1" onKeyUp=""></textarea></td>

            </tr>
            <tr>
                <td><textarea data-id="5" class="inputArea colorInput" id="dataInput_5" name="colorInput_row_2" onKeyUp=""></textarea></td>
                <td><textarea data-id="6" class="inputArea modelInput" id="dataInput_6" name="modelInput_row_2" onKeyUp=""></textarea></td>
                <td><textarea data-id="7" class="inputArea qtyInput" id="dataInput_7" name="qtyInput_row_2" onKeyUp=""></textarea></td>
                <td><textarea data-id="8" class="inputArea costInput" id="dataInput_8" name="costInput_row_2" onKeyUp=""></textarea></td>
            </tr>
            <tr>
                <td><textarea data-id="9" class="inputArea colorInput" id="dataInput_9" name="colorInput_row_3" onKeyUp=""></textarea></td>
                <td><textarea data-id="10" class="inputArea modelInput" id="dataInput_10" name="modelInput_row_3" onKeyUp=""></textarea></td>
                <td><textarea data-id="11" class="inputArea qtyInput" id="dataInput_11" name="qtyInput_row_3" onKeyUp=""></textarea></td>
                <td><textarea data-id="12" class="inputArea costInput" id="dataInput_12" name="costInput_row_3" onKeyUp=""></textarea></td>
            </tr>
        </table>
    </form>
</body>
</html>

我得到的结果是，如果我从上面复制样本集数据的顶行，输入会被分割，但只有第一个分割会粘贴到聚焦的 <textarea> 中。 ，其余的消失。

我可以正确粘贴拆分的唯一方法是:

如果我将“数据 id”全面减少 1，以便第一个“数据 id”为 0，而不是 1。如果我替换:

$("#dataInput_" + din[i]).val(delN[i]);/$("#dataInput_" + dit[i]).val(delT[i]);

与

$("#dataInput_" + i).val(delN[i]);/$("#dataInput_" + i).val(delT[i]);

然后该工具可以工作，但仅限于“数据ID”0。即左上角<textarea>仅。

我知道必须有一些语法解决方案才能使“数据 id”循环正常工作。

最佳答案

主要问题是您对 dit[i] 和 din[i] 的使用。 dit 和 din 不是数组；这将它们视为字符串，并返回第 i 个字符，而不是按预期将 i 添加到值中。还有 Jan Dvorak 指出的循环语法问题(您应该使用缩进代码的编辑器，以便您可以看到结构)。

        if (x.indexOf('\t') > 0) {
            var delT = x.split('\t');
            var dit = parseInt($(this).attr('data-id'), 10);
            for (var i = 0; i < delT.length ; i++) {
                $("#dataInput_" + (dit + i)).val(delT[i]);
            }

         }
         else
         if (x.indexOf('\n') > 0) {
             var delN = x.split('\n');
             var din = parseInt($(this).attr('data-id'), 10);
             for (var i = 0; i < delN.length ; i++) {
                 $("#dataInput_" + (din + i)).val(delN[i]);
                 din += 4;
             }
         }

关于javascript - 有人可以在使用 indexOf、split 然后利用循环将分割粘贴到各个输入时校对我的 javaScript 语法吗？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16621335/

30 4 0
文章推荐： android - 什么时候在 Facebook 上发布应用程序？
文章推荐： iphone - NSValue 到 NSNumber 转换崩溃
文章推荐： ios - 在 Flex 中获取 ipad 可写目录
文章推荐： testing - 机器人框架 : exception handling
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com