html根据复选框勾选顺序生成字符串

最新推荐文章于 2023-03-16 13:23:47 发布

青野月音

最新推荐文章于 2023-03-16 13:23:47 发布

阅读量2.1k

点赞数

分类专栏： html 文章标签： html

本文链接：https://blog.csdn.net/GlatChen/article/details/54948853

版权

html 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>check</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<div>
    <input type="text" id="txtTag" style="width:60%; height:20px;" maxlength="100">
    <input id="chk_tag_" type="checkbox" οnclick="chkTag(this)">
    <label for="chk_tag_">猴子</label>
    <input id="chk_tag_1" type="checkbox" οnclick="chkTag(this)">
    <label for="chk_tag_1">大象</label>
    <input id="chk_tag_2" type="checkbox" οnclick="chkTag(this)">
    <label for="chk_tag_2">狮子</label>
</div>
</body>
<script type="text/javascript">
    String.prototype.trim = function (c) {
        if (!c) c = "\\s";
        return this.replace(new RegExp("(^" + c + "+)|(" + c + "+$)", "ig"), "");
    };

    function chkTag(e) {
        var val = "";
        if (e.checked) {
            val = $("#txtTag").val().trim(',').trim('，') + ',' + $(e).next().text();
            val = val.trim(',').trim('，');
        } else {
            val = $("#txtTag").val().replace(new RegExp("(^|[,，])(" + $(e).next().text().replace(/([()])/g,'\\$1') + ")([,，]|$)", "ig"), function (all, s1, s2, s3) {
                return (s1 && s3) ? s1 : '';
            });
        }
        $("#txtTag").val(val.trim(','));
    }
</script>
</html>