1

我是 Stack 的新手,这是我的第一个问题,但我进行了搜索,但找不到任何我想要完成的具体内容。我完全是为了学习,所以任何可以帮助我更好地理解如何解决这个问题的参考资料都将不胜感激,但如果有人想提供一些示例代码,我也不介意:p

好的,所以场景是这样的。我正在编写一个“Note Creator”,它将根据我在表单中输入的某些字段生成自动客户注释。我已经编写了从文本字段中获取值的脚本,但是我有一个字段,我想成为单选选项或文本字段的组合,并且 java 需要获取使用的任何一个字段和正确的值。任何帮助表示赞赏,以下是我的代码:

    <script type="text/javascript">
    function getNotes() {
        //Grab Variables
        spokeTo = document.thisForm.spokeWith.value;
        problemItem = document.thisForm.problemWith.value;
        resolvedBy = document.thisForm.resolvedWith.value;
        thisTech = document.thisForm.techName.value;
        fSpace = "... "
        //Read in the location information and prep the output container
        outputValue = "";
        {
        //Test if things are blank
        if (spokeTo == "") { alert('Please Enter the Name of the Person.'); }
        else if (problemItem == "") { alert('Please Select the Problem.');  }
        else if (resolvedBy == "") { alert('Please Type Your Resolution.'); }
        else {
            //The loop that puts the output together
                outputValue += "Spoke With: " + spokeTo + "\n\n" + "Called About: " + problemItem + "\n\n" + "Resolution: " + resolvedBy +fSpace + thisTech;
            }
            //output to the user
            document.thisForm.outputArea.value = outputValue;
        }
    }
</script>

        <form name="thisForm">
        <p>
        1. Spoke With: <input type="text" id="spokeWith" class="input" name="spokeWith">
        </p>

        <p>
        2. Called About: 
            Hardware <input type="radio" id="problemWith" class="input" name="problemWith" value="Hardware">
            Software <input type="radio" id="problemWith" class="input" name="problemWith" value="Software">
            <input type="text" id="problemWith" class="input" name="problemWith"><br>
        </p>

        <p>
        3. Resolved By:<br /><br />
            <textarea name="resolvedWith" id="resolvedWith"></textarea>
        </p>

        <p>
        4. Your Name:<br>
            <input type="text" id="techName" class="input" name="techName" /><br>
        </p>

        <p>
            <input type="button" class="button" value="Make My Notes!" onClick="javascript:getNotes();" />
            <input type="reset" class="button" value="Start Over" />
        </p>

        <br><br>

        <textarea name="outputArea" id="outputArea"></textarea>
        <p class="finishMessage" id="finishMessage" name="finishMessage"></p>
    </form>

我特别指的是表单的第 2 步部分,其中包含单选选项和具有相同 ID 和名称的文本字段。我知道每页只能使用一次 ID,所以这可能会改变,但我愿意接受任何建议/帮助。我对 Javascript 的使用中等,仍处于学习阶段。

再次感谢!

--------------- 第二轮 ---------------

这是我在接受所提供答案的建议后修改后的代码。我添加了一堆警报,让我知道我正在设法击中脚本的哪些部分,并且我无法通过第一个警报触发任何东西,并且根本无法获得任何输出了。我错过了什么?

<script type="text/javascript">
    function getNotes() {
    alert('You\'ve hit the function. Congratulations - you didn\'t break the whole damn thing.');
        //Grab Variables
        var spokeTo = document.thisForm.spokeWith.value;
        var resolvedBy = document.thisForm.resolvedWith.value;
        var thisTech = document.thisForm.techName.value;
        var fSpace = "&hellip; ";

        //Grab if radio else text
        var inputVal1 = document.getElementByClass('problemRadio').value;
        var inputVal2 = document.getElementByClass('problemWith').value;
        alert('You made it! Almost there.');
        // If Input Value 1 is not Null, Show Radio Value. Else, show Text Value
        var problemOutput;
        if (inputVal1.length > 0) {
        problemOutput = inputVal1;
        alert('I found value 1!');
        }
        else {
        problemOutput = inputVal2; 
        alert('I found value 2!'); 
        }

        //Read in the location information and prep the output container
        outputValue = "";

        //Test if things are blank
        if (spokeTo == "") { alert('Please Enter the Name of the Person.'); }
        else {
        alert('We Made it to Else to parse outputValue');
            //The loop that puts the output together
                outputValue += "Spoke With: " + spokeTo + "\n\n" + "Called About: " + problemOutput + "\n\n" + "Resolution: " + resolvedBy +fSpace + thisTech;
            }
            //output to the user
            document.thisForm.outputArea.value = outputValue;

    }
</script>

        <form name="thisForm">
        <p>1. Spoke With: <input type="text" id="spokeWith" class="input" name="spokeWith"></p>

        <p>2. Called About: 
            Hardware <input type="radio" id="problemRadio" class="problemRadio" name="problemRadio" value="Hardware">
            Software <input type="radio" id="problemRadio" class="problemRadio" name="problemRadio" value="Software">
            <input type="text" id="problemWith" class="problemWith" name="problemWith"><br>
        </p>

        <p>3. Resolved By:<br /><br />
            <textarea name="resolvedWith" id="resolvedWith"></textarea>
        </p>

        <p>4. Your Name:<br>
            <input type="text" id="techName" class="input" name="techName" /><br>
        </p>

        <p>
            <input type="button" class="button" value="Make My Notes!" onClick="javascript:getNotes();" />
            <input type="reset" class="button" value="Start Over" />
        </p>

        <br><br>

        <textarea name="outputArea" id="outputArea"></textarea>
        <p class="finishMessage" id="finishMessage" name="finishMessage"></p>
    </form>
4

2 回答 2

0

对此感到抱歉,我还不知道在这里获取代码的最佳方法。总是看起来凌乱(直到我弄明白)

我在您的更新中发现的几件事;

1) getElementbyId 是最好的(它没有超过你的第一行)

2) 单选按钮上的重复 ID

3)我们需要“检查”哪些单选按钮被选中

4)总是方便地提醒变量(我已经添加了一些来显示)

我在粗略的测试下面给出了这段代码,它看起来是沿着线..

请参阅下面代码中添加的注释..

 <script type="text/javascript">
   function getNotes() {

    //Grab Variables
    var spokeTo = document.getElementById('spokeWith').value;
    var resolvedBy = document.getElementById('resolvedWith').value;
    var thisTech = document.getElementById('techName').value;
    var fSpace = "&hellip; ";

    alert("spokeTo:" + spokeTo 
      +" , resolvedBy: " +resolvedBy+", thisTech: "+thisTech);

    //Grab if radio else text

    var problemWith = document.getElementById('problemWith').value;

   alert("problemWith: "+problemWith);

/* set a default value */
var problemOutput="other";

/* if they added no notes */
if((problemWith=="") || ( problemWith==null)) {

/* check which radio is selected if any */
if(document.getElementById('problemHardware').checked) {
problemOutput = document.getElementById('problemHardware').value;
}

if(document.getElementById('problemSoftware').checked) {
problemOutput = document.getElementById('problemSoftware').value;
}

} else {
problemOutput=problemWith;
}
alert("problem output is: "+problemOutput);

    alert('You made it! Almost there.');


    //Read in the location information and prep the output container
    outputValue = "";

    //Test if things are blank
    if (spokeTo == "") { alert('Please Enter the Name of the Person.'); }
    else {
    alert('We Made it to Else to parse outputValue');
    /* The loop that puts the output together */

    outputValue += "Spoke With: " 
     + spokeTo + "\n\n" 
     + "Called About: " 
     + problemOutput + "\n\n" 
     + "Resolution: " + resolvedBy +fSpace + thisTech;
        }
        //output to the user
        document.thisForm.outputArea.value = outputValue;

}
  </script>

      <form name="thisForm">
    <p>1. Spoke With: <input type="text" id="spokeWith" class="input" name="spokeWith">  </p>

    <p>2. Called About: 
        Hardware <input type="radio" id="problemHardware" class="problemRadio" name="problemRadio" value="Hardware">
        Software <input type="radio" id="problemSoftware" class="problemRadio" name="problemRadio" value="Software">
        <input type="text" id="problemWith" class="problemWith" name="problemWith"><br>
    </p>

    <p>3. Resolved By:<br /><br />
        <textarea name="resolvedWith" id="resolvedWith"></textarea>
    </p>

    <p>4. Your Name:<br>
        <input type="text" id="techName" class="input" name="techName" /><br>
    </p>

    <p>
        <input type="button" class="button" value="Make My Notes!" onClick="javascript:getNotes();" />
        <input type="reset" class="button" value="Start Over" />
    </p>

    <br><br>

    <textarea name="outputArea" id="outputArea"></textarea>
    <p class="finishMessage" id="finishMessage" name="finishMessage"></p>
</form>
于 2012-05-17T17:59:26.887 回答
0

one approach would be to check on the value and if else

 var input1val = document.getElementById('input1Id').value;
 var input2val = document.getElementById('input2Id').value;

 var valfromeitherbox = (input1val.length > 0) ? input1val : input2val;

 /* UPDATE : ^ is the same as - 

 var valfromeitherbox;
 if(input1val.length > 0) { valfromeitherbox=input1val;
 } else { valfromeitherbox=input2val; }

 */

  document.getElementById('input3Id').value = valfromeitherbox;

 /* if val is empty in input1 use val from text box 2 */

Sorry if a little scrappy , but hope you get the gist and I haven't missed the point

于 2012-05-16T19:24:55.063 回答