如何对具有动态ID的字段中的值求和?

时间:2018-03-16 23:49:22

标签: javascript wordpress sum advanced-custom-fields

我需要对表单的字段求和。 Field ID是动态的。我需要在第三个字段中显示总和的结果。我想知道如何在PHP或JS中执行此操作。

<input type="number" id="acf-field_5a7cb1f6601f3-1-field_5a7cb278601f8" class="" min="0" max="99999" step="any" name="acf[field_5a7cb1f6601f3][1][field_5a7cb278601f8]" value="10" placeholder="">
<input type="number" id="acf-field_5a7cb1f6601f3-2-field_5a7cb278601f8" class="" min="0" max="99999" step="any" name="acf[field_5a7cb1f6601f3][2][field_5a7cb278601f8]" value="12" placeholder="">
<input type="number" id="acf-field_5a7cb1f6601f3-3-field_5a7cb278601f8" class="" min="0" max="99999" step="any" name="acf[field_5a7cb1f6601f3][3][field_5a7cb278601f8]" value="25" placeholder="">

我编辑以明确我需要的东西: Example Function in PHP display Field of result... Example display result

2 个答案:

答案 0 :(得分:1)

<?xml version="1.0" encoding="UTF-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.multiplatformgluonapplication" android:versionCode="1" android:versionName="1.0">
    <supports-screens android:xlargeScreens="true"/>
    <uses-permission android:name="android.permission.CAMERA"/>
    <uses-permission android:name="android.permission.INTERNET"/>
    <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
    <uses-sdk android:minSdkVersion="4" android:targetSdkVersion="21"/>
    <application android:label="MultiplatformGluonApplication" android:name="android.support.multidex.MultiDexApplication" android:icon="@mipmap/ic_launcher">
            <activity android:name="javafxports.android.FXActivity" android:label="MultiplatformGluonApplication" android:screenOrientation="portrait" android:configChanges="orientation|screenSize">
                    <meta-data android:name="main.class" android:value="com.multiplatformgluonapplication.MultiplatformGluonApplication"/>
                    <meta-data android:name="debug.port" android:value="0"/>
                    <intent-filter>
                            <action android:name="android.intent.action.MAIN"/>
                            <category android:name="android.intent.category.LAUNCHER"/>
                    </intent-filter>
            </activity>

            <activity android:name="com.gluonhq.impl.charm.down.plugins.android.PermissionRequestActivity" />
    </application>

使用JQuery(因为你应该imo,为了节省自己的兼容性问题)这将总和所有数字输入的值。您可能希望将来进一步限制。纯JS解决方案如下:

var sum = 0;        
$("input[type=number]").each(function() 
{ 
  if(!isNaN(this.value) && this.value.length!=0) 
  {
    sum += parseFloat(this.value);            
  }         
});

答案 1 :(得分:0)

let total = 0;
document.querySelectorAll('input[type="number"]').forEach(el=>total+=+el.value);
document.querySelector('#total').value = total;
console.log(total);
<input type="number" id="acf-field_5a7cb1f6601f3-1-field_5a7cb278601f8" class="" min="0" max="99999" step="any" name="acf[field_5a7cb1f6601f3][1][field_5a7cb278601f8]" value="10" placeholder="">
<input type="number" id="acf-field_5a7cb1f6601f3-2-field_5a7cb278601f8" class="" min="0" max="99999" step="any" name="acf[field_5a7cb1f6601f3][2][field_5a7cb278601f8]" value="12" placeholder="">
<input type="number" id="acf-field_5a7cb1f6601f3-3-field_5a7cb278601f8" class="" min="0" max="99999" step="any" name="acf[field_5a7cb1f6601f3][3][field_5a7cb278601f8]" value="25" placeholder="">
<br>
<label for="total">Total: </label>
<input id="total">

不要使用ID,使用document.querySelectorAll(...)并使用您熟悉的任何CSS选择器。例如:

 document.querySelectorAll('input[type="number"]').forEach((el)=>{});