javascript - 难以使用JS构建表单摘要

javascript - 难以使用JS构建表单摘要,第1张

对于noobish问题感到抱歉但是,我正在尝试构建一个表单摘要,它将填充div(立即)以及所使用的所有字段。以下是该字段的一小部分示例: Fiddle

由于某种原因,JS没有像我期望的那样工作,有人能指出我做错了什么吗?

例如,我希望输出:" AND name:john除了编号222"。

我还希望能够点击结果将其删除,然后清除该字段。谢谢

$(".allS").change(function () {
    if ($(this).next('.textArea').not(':empty'))
    // varible to hold string
    var str = "";
    $("select option:selected").each(function () {
        str  = $(this).text()   " ";
    });
    $("#text_here").text(str);
}).change();

$('.textArea').change(function(){

    var $inputs = $('form#form :input[type="text"]'),
        result = "";

    $inputs.each(function(){
        // access the individual input as jQuery object via $(this)
        result  = $(this).val() "<br>";
    });

    // store result in some div
    $('div#text_here').text(result);
}).change();

最佳答案:

2 个答案:

答案 0 :(得分:2)

您的代码中存在许多错误。我将它简化为一个非常短的代码,只执行获取所请求输出所需的代码。这是working fiddle。

$(".allS, .textArea").change(function () {
    var str = '';
    if ($('#name').val().length > 0 && $('#number').val().length > 0)
        var str = $('#nameMod>option:selected').text()   ' name:'   $('#name').val()   ' '   $('#numberMod>option:selected').text()   ' number '   $('#number').val();

    $("#text_here").html(str);
});

基本上,这样做是将change事件处理程序附加到两个类(.alls, .textArea),并且当触发事件时,将测试两个输入字段的任何内容。如果此测试通过,则由所有相关值组成一个字符串,并设置div内容。如果测试失败(无内容),则str变量包含空字符串,并清除div

答案 1 :(得分:0)

只是看一下代码,选择器'form#form :input[type="text"]'看起来不对。对于初学者来说,输入不是伪类。此外,属性匹配不应该有引号。

这可能是也可能不是你想要的(我认为是,从你的HTML看):

'form#form input[type=text]'

由于您拨打了<br>,因此text()无法正常工作。请改为呼叫html()

本文经用户投稿或网站收集转载,如有侵权请联系本站。

发表评论

0条回复