通过勾选项在 textarea 文本框中显示对应内容

最新推荐文章于 2022-07-22 09:31:52 发布

缤纷落叶之忠

最新推荐文章于 2022-07-22 09:31:52 发布

阅读量1.5k

点赞数

CC 4.0 BY-SA版权

分类专栏： JavaScript

本文链接：https://blog.csdn.net/x1207008324/article/details/80750935

JavaScript 专栏收录该内容

15 篇文章

订阅专栏

本文介绍了一种用于处理异常商品的系统设计，通过勾选不同类型的异常件（如尺寸不符、颜色不符等），系统能够自动生成相应的备注信息，方便进行后续处理。此方案简化了异常件的记录流程，并提高了工作效率。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

这里写图片描述

HTML
<div>
    <div style='float:left;'>异常件类型:&nbsp;&nbsp;&nbsp;</div>
    <div style='float:left;width: 120px;'>
        <ul>
            <li>
                <input type='checkbox' name='exception_check' value='尺寸不符' onclick='isShow(0);' id='isShow0'>尺寸不符
            </li>
            <li>
                <input type='checkbox' name='exception_check' value='颜色不符' onclick='isShow(1);' id='isShow1'>颜色不符
            </li>
            <li>
                <input type='checkbox' name='exception_check' value='图案/印字不符' onclick='isShow(2);' id='isShow2'>图案/印字不符
            </li>
            <li>
                <input type='checkbox' name='exception_check' value='外观不符' onclick='isShow(3);' id='isShow3'>外观不符
            </li>
            <li>
                <input type='checkbox' name='exception_check' value='材质不符' onclick='isShow(4);' id='isShow4'>材质不符
            </li>
            <li>
                <input type='checkbox' name='exception_check' value='包装不合要求' onclick='isShow(5);' id='isShow5'>包装不合要求
            </li>
            <li>
                <input type='checkbox' name='exception_check' value='少配件' onclick='isShow(6);' id='isShow6'>少配件
            </li>
            <li>
                <input type='checkbox' name='exception_check' value='多货' onclick='isShow(7);' id='isShow7'>多货
            </li>
            <li>
                <input type='checkbox' name='exception_check' value='属性异常' onclick='isShow(8);' id='isShow8'>属性异常
            </li>
        </ul>
    </div>
    <div style='float:left;'>
        备注：<textarea rows='12' cols='25' name='goodsErrDesc'  style='resize:none;vertical-align: top;'></textarea>
    </div>     
</div>



js
//选择异常件类型，备注框显示出相应的可供填写的输入栏
function isShow(value) {
    var String = "";
    switch (value) {
        case 0:
            String = "来货尺寸为：；";
            break;
        case 1:
            String = "来货颜色为：；";
            break;
        case 2:
            String ="来货图案、印字为：；";
            break;
        case 3:
            String = "来货外观为：；";
            break;
        case 4:
            String = "来货材质为：；";
            break;
        case 5:
            String = "来货包装为：；";
            break;
        case 6:
            String = "来货少配件：；";
            break;
        case 7:
            String = "多货 ID：；数量：；";
            break;
        case 8:
            String = "来货属性为：；";
            break;
    }
    //确定选择项
    if ($("#isShow" + value).is(":checked")) {
        //显示多个内容并换行
        $("[name='goodsErrDesc']").val($("[name='goodsErrDesc']").val() + String + "\r\n");
    } else {
        $("[name='exception_check']").attr("checked", false);
        $("[name=goodsErrDesc]").val("");
    }
}



var ecp_desc = "";
var ecp_sub_desc = "";
if ($("input[name='exception_check']:checked").length > 0) {
    $("input[name='exception_check']:checked").each(function(){ 
        ecp_desc += $(this).val() + ";";
        ecp_sub_desc += $(this).val() + ";";
    });
}
//少配件;属性异常;