Javascript 根据body类值的值填充字段

Javascript 根据body类值的值填充字段,javascript,jquery,html,Javascript,Jquery,Html,我试图用body元素中的一个类填充表单中的一个字段,该类以“pageid-”开头,后面有一个数字。我想找到这个数字,并将其添加为表单值,使我能够在每一页上使用相同的表单,但确定表单提交的页面 我仍在学习Java/JQuery,因此很抱歉不知道如何在这里返回值。它以[object object]的形式出现-这是我目前拥有的: HTML 试试这个: var thisid = $('[class^="pageid-"]'); $(document).ready(function () { v

我试图用body元素中的一个类填充表单中的一个字段,该类以“pageid-”开头,后面有一个数字。我想找到这个数字,并将其添加为表单值,使我能够在每一页上使用相同的表单,但确定表单提交的页面

我仍在学习Java/JQuery,因此很抱歉不知道如何在这里返回值。它以[object object]的形式出现-这是我目前拥有的:

HTML

试试这个:

var thisid = $('[class^="pageid-"]');

$(document).ready(function () {
    var num = $(thisid).attr("class").split("-").pop(); // it will extract the number from class 
    $("#test1").val( num ); // set that number to input field
});
试试这个:

var thisid = $('[class^="pageid-"]');

$(document).ready(function () {
    var num = $(thisid).attr("class").split("-").pop(); // it will extract the number from class 
    $("#test1").val( num ); // set that number to input field
});
我建议:

$(document).ready(function(){
    // converts the classList - an Array-like list of class-names - of
    // of the <body> element/node into an Array; and then filters that
    // Array of class-names using Array.filter.prototype(), to retain
    // only those classes for which the inner comparison return true:
    var classValue = Array.from( document.body.classList ).filter(function(c){
        // 'c' (the first argument of the method) is the
        // array-element of the Array over which we're iterating
        // and is supplied by the Array method.

          // here we return only those class-names that have
          // a string of numbers ('\d+') before the end of
          // string ('$'), using RegExp.test() to return
          // a Boolean, true: the string matches the regexp,
          //            false: the string does not match:
                    return /\d+$/.test(c);

                // here we assume only one matching class-name,
                // and user Array.prototype.join('') to convert
                // that single-element array into a String 
                // and split that class-name on the '-' character:
                }).join('').split('-')
                // and use Array.prototype.pop() to retrieve
                // the last element of the returned Array:
                .pop();

    // finding the element with the id 'test1' and setting
    // its value property to the found-value:
    document.getElementById('test1').value = classValue;
});
无法工作是因为
thisid
是一个jQuery对象,当您试图通过传递对象(对象,而不是对象属性)来设置字符串值时,JavaScript引擎将尝试将该对象强制为字符串表示形式,该表示形式将生成
[对象对象]
的值,这可以通过以下方式进行验证:

console.log({}.toString());
var obj={};
document.querySelector('input')。value=obj;
log(obj.toString())

我建议:

$(document).ready(function(){
    // converts the classList - an Array-like list of class-names - of
    // of the <body> element/node into an Array; and then filters that
    // Array of class-names using Array.filter.prototype(), to retain
    // only those classes for which the inner comparison return true:
    var classValue = Array.from( document.body.classList ).filter(function(c){
        // 'c' (the first argument of the method) is the
        // array-element of the Array over which we're iterating
        // and is supplied by the Array method.

          // here we return only those class-names that have
          // a string of numbers ('\d+') before the end of
          // string ('$'), using RegExp.test() to return
          // a Boolean, true: the string matches the regexp,
          //            false: the string does not match:
                    return /\d+$/.test(c);

                // here we assume only one matching class-name,
                // and user Array.prototype.join('') to convert
                // that single-element array into a String 
                // and split that class-name on the '-' character:
                }).join('').split('-')
                // and use Array.prototype.pop() to retrieve
                // the last element of the returned Array:
                .pop();

    // finding the element with the id 'test1' and setting
    // its value property to the found-value:
    document.getElementById('test1').value = classValue;
});
无法工作是因为
thisid
是一个jQuery对象,当您试图通过传递对象(对象,而不是对象属性)来设置字符串值时,JavaScript引擎将尝试将该对象强制为字符串表示形式,该表示形式将生成
[对象对象]
的值,这可以通过以下方式进行验证:

console.log({}.toString());
var obj={};
document.querySelector('input')。value=obj;
log(obj.toString())


可以是$(“#test1”).val(thiid.className);我建议将该值作为数据属性添加,而不是从类中解析它(这就是该属性的用途)。尸体看起来像。这样你可以有其他的类在里面。你可以用这个id.data(“id”)@valarauko-dude来检索对象数据是的,我也没有想到,但我知道数据属性现在被越来越多地使用,而且用途非常广泛;我建议将该值作为数据属性添加,而不是从类中解析它(这就是该属性的用途)。尸体看起来像。这样你可以有其他的类在里面。你可以用这个id来检索对象数据。数据(“id”)@valarauko明智的建议都德是的,我也没有想到,但我知道数据属性现在被越来越多地使用,而且用途非常广泛。做得非常好,都德,非常感谢你。当我被允许时,我会选择答案-希望这对其他人也有用!有趣的是,你使用了
.pop()
.split()
这两个词,我从来没有想到:)做得很好,伙计,非常感谢你。当我被允许时,我会选择答案-希望这对其他人也有用!有趣的是,你使用了
.pop()
.split()
这两种方法,你永远不会想到:)谢谢David,这是一种很有趣的方法,可以稍微改变一下。在纸上看起来不错,但测试对我来说似乎没有任何价值。也许我遗漏了什么:)对不起,没有看到你的评论,我的回复太仓促了。将重新测试。创建了一个fiddle,David,没有看到任何返回结果仍然奇怪问题是我相当愚蠢地使用了一个保留字(“class”)作为变量,并且在调用
split()
之前忘记了将数组转换为字符串。刚刚纠正得太晚了。谢谢大卫,有很好的记录。由于第一个答案也是正确的,我认为坚持这样做是公平的,但这也是一个经过测试和工作良好的伟大和彻底的替代解决方案。谢谢David,有趣的做法略有不同。在纸上看起来不错,但测试对我来说似乎没有任何价值。也许我遗漏了什么:)对不起,没有看到你的评论,我的回复太仓促了。将重新测试。创建了一个fiddle,David,没有看到任何返回结果仍然奇怪问题是我相当愚蠢地使用了一个保留字(“class”)作为变量,并且在调用
split()
之前忘记了将数组转换为字符串。刚刚纠正得太晚了。谢谢大卫,有很好的记录。由于第一个答案也是正确的,我认为坚持下去是公平的,但这也是一个经过测试和工作良好的伟大和彻底的替代解决方案。